Results 1 to 3 of 3

Thread: Image Swapping on splash page

  1. #1
    Join Date
    Feb 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Image Swapping on splash page

    1) Script Title: Image Thumbnail Viewer II

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...thumbnail2.htm

    3) Describe problem: I want my splash page to work like this one...

    http://jonesandfarthing.com/pictures.html

    My page is: www.amphi.com/~gmoss

    I am an amateur web site developer (I teach 5th grade) who needs some help with my splash page. Obviously, my code is not complete, or correct.

    Can you help me so that when you mouse over the small pics on the right side, you replace the image on the left, with a big version of the small image you are mousing over?

    Is this a "div" or "loadarea" issue? I don't really understand these tags.

    My code works fine on my computer, but when I upload it to the server, it doesn't run across the internet (from a server).

    Can you tell me what is missing, or in the wrong place???

    Thank you,

    Gary

  2. #2
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    262
    Thanks
    42
    Thanked 24 Times in 24 Posts

    Default file path to JS?

    Using so many <img src="images/pixel.gif" width="00" height="14"> spacers inTable cells makes it hard to spot your real images. And target="_top" is used in <frameset>s.

    Might your problem be here?

    Code:
     
    <script type="text/javascript" src="thumbnailviewer2.js" defer="defer"> /*Is this right path to JS file?*/ </script>
    or here
    
    <td colspan=5>
    <div id="loadarea" style="width: 455px">
    <img src="images/09004.jpg" width="450" height="338">
    </div>
    <h2 />
    <div id="loadarea2" style="width: 462px"></div>
    </td>
    The DD script at http://www.dynamicdrive.com/dynamici...nailviewer2.js has nice features, but looked very complicated to me.

    Basically, for a simple version of this effect (e.g., http://www.auntnini.com/sketch/index.htm), what you could do is give your big image a name (such as "holder" or "sue") so you can talk to it. Then in link calling JavaScript
    <a href="#nogo" onMouseOver="imgOn('img2')" onClick="document.images['holder'].src = gif2.src; return false">
    surrounding clickable thumbnail or text</a>
    change image source of big "holder" picture. In the mouseOver instance here, a <script> defined variables and pre-loaded images
    img1 = new Image(); img1.src = 'pic01.jpg'; img2 = new Image(); img2.src = 'pic02.jpg'; and created the
    function imgOn(imgName) {
    if (document.images) {
    document["holder"].src = eval(imgName + ".src"); }

  3. #3
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    262
    Thanks
    42
    Thanked 24 Times in 24 Posts

    Default where is your JavaScript file?

    It does not seem you downloaded the JavaScript file that makes this work
    The code references an external .js file, which you should download below: * thumbnailviewer2.js

Bookmarks

Posting Permissions

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