www.webdeveloper.com
Results 1 to 2 of 2

Thread: Javascripting Firefox

  1. #1
    Join Date
    Apr 2011
    Posts
    1

    Javascripting Firefox

    I am using the following code to display images for a website, seems to work very nicely in Safari, images render a little slow in ie however in firefox the main image displays but will not change image when I click on the next image? Any suggestions? Thanks in advance.

    <HEAD>

    <SCRIPT LANGUAGE="JavaScript">

    function changeImage(filename)
    {
    mainimage.src = filename;
    }

    </script>

    </HEAD>



    <BODY>

    <p>
    <a href="javascript:changeImage('image-viewer/image1.jpg')">Image 1</a>
    <a href="javascript:changeImage('image-viewer/image2.jpg')">Image 2</a>
    <a href="javascript:changeImage('image-viewer/image3.jpg')">Image 3</a>
    <a href="javascript:changeImage('image-viewer/image4.jpg')">Image 4</a>
    </p>
    <p>
    <img name="mainimage" src="image-viewer/blank.jpg"></p>


    <p><center>
    <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
    by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
    </center><p>

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,373

    Lightbulb

    That's a pretty old version ...

    If that's what you want to do, try this...
    Code:
    <html>
    <head>
    <SCRIPT type="text/javascript"> <!-- archaic format: LANGUAGE="JavaScript" -->
    
    var baseURL = 'image-viewer/';
    var imgList = ['','image1.jpg','image2.jpg','image3.jpg','image4.jpg'];
    function changeImage(ptr) {
      document.getElementById('mainimage').src = baseURL+imgList[ptr];
      document.getElementById('mainimage').alt = imgList[ptr];
    }
    </script>
    </head>
    <body>
    
    <p>
    <a href="#" onclick="changeImage(1)">Image 1</a>
    <a href="#" onclick="changeImage(2)">Image 2</a>
    <a href="#" onclick="changeImage(3)">Image 3</a>
    <a href="#" onclick="changeImage(4)">Image 4</a>
    </p>
    <p>
    <img id="mainimage" src="image-viewer/blank.jpg" alt="blank.jpg"></p>
    
    </body>
    </html>
    BTW: You should enclose your script between [ code] and [ /code] tags (without the spaces)
    to make it easier to read, copy, test your programs.

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