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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Alternate images and div content

    Hi,

    I am currently working on a project that requires javascript onClick events.

    What I am looking to achieve is that when an image is clicked, the content is shown and the image changes to another image, and when this is clicked again the image reverts back and the content becomes hidden

    Currently I have this in script tags

    Code:
    <script language="javascript" type="text/javascript">
    
    function setVis(id, vis) {
    document.getElementById(id).style.display = vis;
    }
    
    function swapImage() {
    switch (imageNo) {
     case 1:
       image.src = "images/img.png"
       imageNo = 2
       return(false);
    case 2:
       image.src = "images/img1.png"
       imageNo = 1
       return(false);
     }
    }
    
    </script>
    and this in the main html page

    Code:
    <h4><a href="#" onclick="setVis('content','inline');return false;"><img id="image" name="image" src="images/img.png" width="10" height="10" border="0" onclick="swapImage();"/></a> Content</h4>
    This doesn't work it shows the content but it won't hide it again, and the images do not change.

    I would appreciate any help that can be offered thanks
    Last edited by jimbojones; 03-03-2011 at 06:19 PM.

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Code:
    switch (imageNo) {
    What supposes to be the variable imageNo? You have not defined it before the switch.

    Could be something like this:
    Code:
    function swapImage(img) {
    img.src=img.src.match(/img1/)?'images/img.png':'images/img1.png';
    }
    Last edited by Kor; 03-04-2011 at 11:37 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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