PDA

View Full Version : fadeslideshow not working in IE8



aGood
01-09-2012, 10:24 PM
1) Script Title: fadeslideshow not working in IE8

2) Script URL (on DD):
I was hoping not to give the address out as I do not wish google to pick this one up. I have pasted the code here.

This is in my head

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="scripts/fadeslideshow.js">


/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [934, 369], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["images/banner-home1.jpg"],
["images/banner-home2.jpg"],
["images/banner-home3.jpg"],
["images/banner-home4.jpg"],
["images/banner-home5.jpg"]
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand"
})
</script>


And this is what I'm calling in my HTML

<div id="fadeshow1"></div>

3) Describe problem:

I understand you have a lot of these small problems and I have gone through them all. I have no trailing commas, my images on not on my local drive and I have located the proper js file and code.

However through this all I have not been able to find out why it is not working in ONLY IE8. It works in ALL the other browsers except this one. If anyone can give me advice or ideas as to why this might be happening I would appreciate it!

jscheuer1
01-10-2012, 03:25 AM
You can put the address to the page in a form Google will not pick up on, like instead of:


http://www.dynamicdrive.com/somepage.htm

Put like:

dynamicdrive dot com/somepage.htm

Anyways, looking at your code, it looks OK. If it's working in all others, including IE 7 and IE 9, it would be very hard to say without seeing it. The only thing I can think to try before actually seeing the page would be to update the jQuery version. Change:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

to:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

But that might not be it. It's very hard to diagnose code in cases like this without seeing the page live. It's probably something else than the jQuery version, though that's worth a try. And if it is something else, it's probably caused by something not shown in your post.

aGood
01-10-2012, 05:48 AM
Thanks for the reply. That simple change of the version of jQuery helped me in IE8 but then breaks in Chrome for Windows. Why might it break in Chrome? (I'm on a MAC and testing with Adobe BrowserLab). So I reverted it back to the lower version and will hand out the link in the way you suggested.

URL Removed

I've underlined the name of the site as I've placed it all together as google can still pick up the keywords.

Hope this helps. I appreciate the help!

jscheuer1
01-10-2012, 08:00 AM
I can't be certain because the custom fonts aren't loading in my local mock up and they may be a factor in Chrome because updating the jQuery version here did not hurt Chrome. However, if you reorder the scripts in the head so that they appear like so with jQuery and the fadeslideshow code coming before the Prototype/Scriptaculous/Lightbox code it works in IE 8 regardless of the jQuery version:


<!--conditional comments -->
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!--[if IE 6]>
<script type="text/javascript" src="scripts/DD_belatedPNG.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.png');
</script>
<![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="scripts/fadeslideshow.js">


/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [934, 369], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["images/banner-home1.jpg"],
["images/banner-home2.jpg"],
["images/banner-home3.jpg"],
["images/banner-home4.jpg"],
["images/banner-home5.jpg"]
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand"
})
</script>

<script type="text/javascript" src="scripts/prototype.js"></script>
<script type="text/javascript" src="scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="scripts/lightbox.js"></script>


And at that point it doesn't seem to matter which version of jQuery you use. The 1.6.4 version is generally more stable though, so I picked that one. Works here in both IE 8 and Chrome either way. But as I say, it worked in Chrome with the jQuery update and without reordering. I would be at least a little skeptical of Browser Lab's results though. But they did make the right call on IE 8. So, if you set it up like I have it above with jQuery 1.6.4 and Browser Lab still says there's a problem in Chrome, let me see the page like that, and I'll tell you if it's actually working in Chrome or not.

As the problem arises in the first place at least in part because jQuery and Prototype/Scriptaculous are in conflict, you might want to consider switching to a jQuery based Lightbox type script.

See:

http://www.dynamicdrive.com/forums/blog.php?b=247

for more information.

aGood
01-10-2012, 06:40 PM
jscheuer1, thankyou. It's fixed now.

I'll remember for next time about not just the version but the arrangement as well, and I'll be looking into SlimBox2 for usage with this fadeslideshow.