SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Change between 2 images

    Hello,

    Im tray to do some script that change between 2 images:

    I want to show one image that eich click chage it.

    When i click on the image it change to img1 and when i click again it chage to img2.

    Change btween img1 to img2 and img2 to img1......

    How i can do it?

    Thank you very much!!

  2. #2
    SitePoint Zealot coothead's Avatar
    Join Date
    Jan 2005
    Location
    Chertsey, London, England
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi there taly88,

    and a warm welcome to these forums.

    Here is a basic example...
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <base href="http://www.coothead.co.uk/images/">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    
    <title></title>
    
    <style type="text/css">
    body {
        background-color:#c0c0c0;
     }
    #myimage {
        display:block;
        width:360px;
        height:280px;
        border:3px double #000;
        margin:auto;
        cursor:pointer;
     }
    </style>
    
    <script type="text/javascript">
    
    function swapImage(){
       test=true;
       obj=document.getElementById('myimage');
    obj.onclick=function() {
       test=(test==true)?
       (obj.src='banana.jpg',test=false):
       (obj.src='apple.jpg',test=true);
      }
     }
    
    if(window.addEventListener){
       window.addEventListener('load',swapImage,false);
     }
    else { 
    if(window.attachEvent){
       window.attachEvent('onload',swapImage);
      }
     }
    </script>
    
    </head>
    <body>
    
    <div>
     <img id="myimage" src="apple.jpg" alt="apple">
    </div>
    
    </body>
    </html>
    
    coothead

  3. #3
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks coothead!!

    But do you have some solution for me to do it with out javascript?

    I'm tray to add this code to post in wordpress but its not get java only php/html.

  4. #4
    SitePoint Zealot coothead's Avatar
    Join Date
    Jan 2005
    Location
    Chertsey, London, England
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi there taly88,

    you posted your problem in the JavaScript forum.

    If you do not want a javascript solution then you should post your problem in the forum appropriate to your requirements.

    coothead

  5. #5
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok i will do it right now..

    Sorry about this, i see only now that i cant add only PHP/HTML code...

  6. #6
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    The thread is continued here.
    Maleika E. A. | Rockatee | Twitter | Dribbble




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
  •