Ultimate Fade-in slideshow works on IE but not on Chrome or Firefox
1) Script Title: Ultimate Fade-in slide show v2.4
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm
3) Describe problem: Hi,
I wish to make use of this slide show on my web site. But before deploying I wanted to test it. The following is exactly the code I typed out on a text editor.
When I opened the text file with IE it worked fine. But it did not work with Google Chrome or Firefox. All that was shown were the custom buttons that allowed the user to navigate between slides. I wonder if any part of the code needs to be altered or some setting on the browsers need to be changed to allow the contents to be properly shown.Code:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="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: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image imagearray: [ ["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."], ["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"], ["http://i30.tinypic.com/531q3n.jpg"], ["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element! ], 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", togglerid: "" }) var mygallery2=new fadeSlideShow({ wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image imagearray: [ ["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."], ["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"], ["http://i30.tinypic.com/531q3n.jpg"], ["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element! ], displaymode: {type:'manual', pause:2500, cycles:0, wraparound:false}, persist: false, //remember last viewed slide and recall within same session? fadeduration: 500, //transition duration (milliseconds) descreveal: "always", togglerid: "fadeshow2toggler" }) </script> </head> <body> <div id="fadeshow1"></div> <br /> <div id="fadeshow2"></div> <div id="fadeshow2toggler" style="width:250px; text-align:center; margin-top:10px"> <a href="#" class="prev"><img src="http://i31.tinypic.com/302rn5v.png" style="border-width:0" /></a> <span class="status" style="margin:0 50px; font-weight:bold"></span> <a href="#" class="next"><img src="http://i30.tinypic.com/lzkux.png" style="border-width:0" /></a> </div> </body> </html>
Note: I don't know if this point has any bearing on the problem, I doubt it. I'm using a 64 bit machine but the operating system, Windows XP, accepts all 32 bit programs.
I would be grateful for all help.
CSS Codes
Reply With Quote
Bookmarks