SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Feb 2012
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image Swap with Unique Titles

    Dear Everyone,

    I need to create a image gallery in which the large image changes to the large version of whatever thumbnail image is clicked; my problem is how to create it so that when one hovers over the large image, the title - "my boat"... - (not alt) appears to correspond to the correct thumbnail image. I can only get it so that one specific title appears when one hovers over the large image - the title isn't dependent on what image is showing.

    I hope this makes sense - I can't find any help on it at all!!

    Thanks so much!!!

    Chava

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Portsmouth UK
    Posts
    1,499
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <!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" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script type="text/javascript">
    /*<![CDATA[*/
    
    function Swap(obj,id,src,title){
     var img=document.getElementById(id);
     img.removeAttribute('title');
     if (title){
      img.title=title;
     }
     img.src=src||obj.src;
    }
    /*]]>*/
    </script></head>
    
    <body>
    
    <img id="tst" src="http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg"  />
    
    <img src="http://www.vicsjavascripts.org.uk/StdImages/Egypt10.jpg" width="100" onmouseup="Swap(this,'tst','http://www.vicsjavascripts.org.uk/StdImages/Egypt11.jpg','My Title');" />
    </body>
    
    </html>

  3. #3
    SitePoint Member
    Join Date
    Feb 2012
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    THANK YOU!!

    Dear vwphillips,

    THANK YOU SO MUCH!! I actually could understand the code a bit and was able to adjust it to my needs.

    I appreciate it tremendously
    Chava


Tags for this Thread

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
  •