Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2012
    Thanked 0 Times in 0 Posts

    problem with a cross fade slideshow

    I have an "jpeg slideshow" on a HTML page created using Javascript. It works fine in Firefox, Chrome & Safari but loads slowly in Seamonkey and does not load at all in Internet Explorer. The slideshow does have 46 images .... Is that a problem ?

    Here is the page on the website: http://www.victorrossi.com/home2.htm

    Here is the code with the Javascript enabled "jpeg slideshow":

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Victor Rossi - Private Label and Couture</title>
    <style type="text/css">
    body { background-color:#FFF; margin-top:0; margin-left:0;
    /*bgcolor="#FFFFFF" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" */
    p { color:#808080; font-size:medium;
    /*font color= size=3 */
    td {color:#808080; }
    #center{text-align:center; font-weight:bold;}
    #table {position:absolute; margin-left:25%;
    #menu, #logo {text-align:center; }
    #menu {font-weight:bold; }
    #img {height:400px; width:auto; }
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://www.victorrossi.com/fadeslideshow.js">
    <script type="text/javascript">
    var mygallery=new fadeSlideShow({
    wrapperid: "fadeshow1",
    dimensions: [700, 400],
    imagearray: [
    displaymode: {type:'auto', pause:500, cycles:0, wraparound:false},
    persist: false,
    fadeduration: 500,
    descreveal: "ondemand",
    togglerid: ""
    <body >
    <img id="display" src="VR-logo.jpg" width="157px" height="33px"><br>
    <a href="home.htm">Home</a> |
    <a href="catalog.htm">Catalog</a> |
    <a href="gallery.htm">Fashion Gallery</a> |
    <a href="size.htm">Size Chart</a> |
    <a href="media.htm">In the Media</a> |
    <a href="about.htm">About Us</a> |
    <a href="contact.htm">Contact</a>
    <p><hr width=50%><p>
    <table cellspacing=0 cellpadding=0 width="702" border=0>
    <td valign=top>
    <id="center"><b>Victor Rossi has evolved from its custom couture design roots into one of the world's most reliable design houses, private label
    manufacturers and global sourcing agents. Our combination of innovation, stellar craftsmanship, exceptional customer and client care are our hallmarks.</b>
    <div id="fadeshow1"></div>
    <p><hr width=25%><p>
    <tr><td align=center>
    <FORM METHOD=POST ACTION="http://us.1.p10.webhosting.yahoo.com/forms?login=singh100">
    <b><font color=#808080 size=3>Join the Victor Rossi mailing list !</b></font><br>
    <table border=0>
    <tr><td><font color=#808080>name:<BR>
    e-mail: <BR></td>
    <td><INPUT size=27 name="name"><br>
    <INPUT size=27 name="e-mail"></font></td></tr>
    <tr><td colspan=2 align=center><INPUT type=submit value="Submit to Victor Rossi">
    <INPUT NAME=subject TYPE=HIDDEN VALUE="e-mail list">
    <input type="hidden" name="required_fields" value="name,e-mail">
    <input type="hidden" name="next_url" value="http://victorrossi.com/thankyou.htm">
    <!-- text below generated by server. PLEASE REMOVE --><!-- Counter/Statistics data collection code --><script language="JavaScript" src="http://l.yimg.com/d/lib/smb/js/hosting/cp/js_source/whv2_001.js"></script><script language="javascript">geovisit();</script><noscript><img id="display" src="http://visit.webhosting.yahoo.com/visit.gif?us1341942141" alt="setstats" border="0" width="1" height="1"></noscript>

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Thanked 4,738 Times in 4,700 Posts
    It runs the same in MSIE 9 as it does in FF.

    BOTH have some minor glitches because you apparently aren't waiting to begin the fades until all the images are fully loaded. (Once the images have loaded and are cached, both browsers work fine when re-visiting the pages.) The glitch is that only half the image appears and then finishes loading when you get to about the 3rd or 4th image in sequence. Clearly, the browser had not finished loading the image by the time you wanted to display it.

    I'd strongly suggest that you show a FIXED image to begin with and then not start the fading until all images are known to be fully loaded.

    I don't use jQuery so I won't try to tell you how to do that.

    If the code doesn't work in earlier versions of IE and/or in other browsers, then I'd guess that the version of jQuery you are using may have a bug. But I certainly don't know that.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts