www.webdeveloper.com
Results 1 to 10 of 10

Thread: Changing images in Javascript (IE6)

  1. #1
    Join Date
    Feb 2009
    Posts
    6

    Changing images in Javascript (IE6)

    This issue has me stumped.

    Code:
      document.getElementById("spotlight_title").innerHTML = spotlightArray[currentEntry][0];
      var image = document.getElementById("spotlight_image");
      image.src = path + spotlightArray[currentEntry][1];
      
      document.getElementById("spotlight_link").href = spotlightArray[currentEntry][2];
      document.getElementById("spotlight_sidetext").innerHTML = '<p>' + spotlightArray[currentEntry][3] + ' </p>' + 
        '<div id="spotlight_sidetextlink"><a href="' + spotlightArray[currentEntry][2] + '">' + spotlightArray[currentEntry][4] + '</a></div>';
      document.getElementById("spotlight_caption").innerHTML = spotlightArray[currentEntry][5];
      document.getElementById("spotlight_caption_extra").innerHTML = spotlightArray[currentEntry][6];
    
      currentEntry = (currentEntry < spotlightArray.length-1) ? currentEntry + 1 : 0;
    Above is some code used to change to cycle through a sort of 'spotlight' feature as I call it.

    Everything is working fine most browsers, however in IE6 the spotlight_image code isn't working. It always stays stuck on the first image. I've tried a few methods to fix this, such as JQuery however nothing is working.

    Any ideas?

  2. #2
    Join Date
    Feb 2009
    Posts
    6
    Any ideas? I've spent hours searching all over the Internet to no avail...

  3. #3
    Join Date
    Feb 2009
    Posts
    6
    I'm sorry for rebumping this but this is for a client and I'm running out time.

  4. #4
    Join Date
    Feb 2009
    Posts
    6
    That's it. One last time and I promise I won't bump this again.

  5. #5
    Join Date
    Oct 2007
    Posts
    175
    I'm probably not understanding correctly but are you trying to make an album of images users can cycle through?

    I think your term "spotlight" may have people confused, or at least me

  6. #6
    Join Date
    Feb 2009
    Posts
    6
    Basically it's some entries that are cycled through at a delay using setTimeout. Each entry consists of a few items of text (title, caption, sidetext) and an image. Everything works perfectly in FF, IE7, Chrome, etc, however IE6 refuses to change the image. The actual 'change' function is listed below:

    Code:
    function changeEntry()
    { 
      document.getElementById("spotlight_title").innerHTML = spotlightArray[currentEntry][0];
      var image = document.getElementById("spotlight_image");
      image.src = path + spotlightArray[currentEntry][1];
      //image.setAttribute("src", path + spotlightArray[currentEntry][1]);
      //document.getElementById("spotlight_image").setAttribute("src", path + spotlightArray[currentEntry][1]);
      
      document.getElementById("spotlight_link").href = spotlightArray[currentEntry][2];
      document.getElementById("spotlight_sidetext").innerHTML = '<p>' + spotlightArray[currentEntry][3] + ' </p>' + 
        '<div id="spotlight_sidetextlink"><a href="' + spotlightArray[currentEntry][2] + '">' + spotlightArray[currentEntry][4] + '</a></div>';
      document.getElementById("spotlight_caption").innerHTML = spotlightArray[currentEntry][5];
      document.getElementById("spotlight_caption_extra").innerHTML = spotlightArray[currentEntry][6];
    
      currentEntry = (currentEntry < spotlightArray.length-1) ? currentEntry + 1 : 0;
    
    }

  7. #7
    Join Date
    Oct 2007
    Posts
    175
    I was reading around and found innerHTML has issues with ie6. there are work arounds and one I found is an issue with IE's settings - may be set to "never" check for a new page. Setting it to automatic may fix this tho its not consistent for any other users. I would start with bugs and issues with innerHTML and ie6.

  8. #8
    Join Date
    Feb 2009
    Posts
    6
    Thanks for the reply but all the instances of innerHTML are working correctly. The only part of the function causing me grief is the image part (the two commented out lines underneath are two other ways I tried to achieve a result but none worked).

    I recall seeing somewhere that IE6 may not have enough time to make the switch before the function ends or something. Is it possible this could be the issue and if so how can it be resolved?

  9. #9
    Join Date
    Oct 2007
    Posts
    175
    I use innerHTML at one point to create an overlay effect and found deleting all spaces made it work correctly in ie6,

    try either:
    Code:
      
    image.setAttribute("src",path+spotlightArray[currentEntry][1]);
    
    or
    
    document.getElementById("spotlight_image").setAttribute("src",path+spotlightArray[currentEntry][1]);

  10. #10
    Join Date
    Oct 2007
    Posts
    175
    I found this article

    http://www.quirksmode.org/bugreports...d_with_th.html

    might be your issue

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles