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

    Image load problems across platforms

    I am having some problems with javascript working across platforms. I have had the following results with the following code:

    Code worked as expected on: Mac OSX with Safari, Mac OSX with FireFox, MacOSX with IE 5.2, Windows 2K with FireFox

    Code did not work as expected on: Windows 2K with IE 5.0, Windows 2K with IE 6.0

    The problem code (versions of this code exist in three places on the page) is as follows:
    function left() {
    if (imageNum > 0) {
    imageNum--;
    image = new Image();
    image.src = tFileArray[imageNum];
    --> image.onload = changeImg("img1",image.src);
    image.src = tFileArray[imageNum+1];
    image.onload = changeImg("img2",image.src);
    image.src = tFileArray[imageNum+2];
    image.onload = changeImg("img3",image.src);
    image.src = tFileArray[imageNum+3];
    image.onload = changeImg("img4",image.src);
    }
    }

    The function “Left” is called when a user clicks on an unrelated image (a left arrow) and should scroll 4 images (these images are named “img1,img2,img3,img4” in the page. “tFileArray[]” is a collection of thumbnail file names (generally something like “tBlue4.jpg”). "imageNum" is a global variable that tracks image scrolling. The changeImg function is as follows:

    function changeImg(id, image) {
    eval("document."+id+".src=\""+image+"\"");
    }

    Originally, in the Left function, I had the eval statement instead of the function call, but this did not work either (although it did work on the Mac and with Firefox on Windows 2K).

    In IE, I get a “Not Implemented” error at the line with the arrow on it. The first image (img1) is changed, but none of the later images are changed.

    The page can be viewed at http://www.idlelife.net/portfolio/index.php. Please, let me know if I have left out any crucial information. Any suggestions would be appreciated.

  • #2
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I haven't looked at your page but looking at your codes above I would think your attempt to pass a function arguement as a string is breaking the onload event...

    You could try using:
    image.onload = new Function('changeImg("img1",image.src)');

    But that gets a little tricky so I would probably go with:
    image.onload = changeImg(1,image.src);

    With a slight change to your changeImg function:

    function changeImg(id, image) {
    document.images['img'+id].src = image;
    }

    Then again, I would think there must be easier ways to change the source of several images simultaneously...

    .....Willy

  • #3
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Update

    I have simplified the code quite a bit. The functions now look like this:

    function left() {
    if (imageNum > 0) {
    imageNum--;
    imageNum2 = imageNum + 1;
    imageNum3 = imageNum + 2;
    imageNum4 = imageNum + 3;
    eval("document.img1.src=Imaget"+imageNum+".src");
    eval("document.img2.src=Imaget"+imageNum2+".src");
    eval("document.img3.src=Imaget"+imageNum3+".src");
    eval("document.img4.src=Imaget"+imageNum4+".src");
    }
    }

    This seems to work fine on a Mac using any browser (Safari, FireFox, IE). However, using IE on windows still gives me a problem. When the function is run, all of the associated thumbnails (img1, img2, etc.) disappear. However, if you right click where the image is supposed to be and choose "Show Picture" the correct image comes up. To see this in action go to www.idlelife.net/portfolio/index.php.

    Does anyone know why the image does not show up initially when using IE on Windows?

    Thanks in advance for your help.


  •  

    Posting Permissions

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