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 Coder
    Join Date
    Jul 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    change image width click

    i have simple code that chage the width of picture onclick
    PHP Code:
    <script language="javascript">
    var 
    changed;
    function 
    ab(pic){
    pic.style.height="16px";
    }
    </script>
    <h4>text</h4>
    <img src="image.png"    onclick="ab(this); " /> 
    i want to do when click on
    PHP Code:
    <h4><h4>text</h4></h4
    it is run the function on the image..and change the width of picture
    how? how i call to function?

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,714
    Thanks
    0
    Thanked 238 Times in 233 Posts
    Hi there yossidd,

    here is a one possible solution...
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <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">
    #myh4 {
        cursor:pointer;
     }
    #myh4:hover {
        color:#900;
     }
    #myimg {
        display:block;
        border:1px solid #000;
        margin:auto;
     }
    .image-width {
        width:100px;
     }
    </style>
    
    <script type="text/javascript">
    function init() {
       document.getElementById('myh4').onclick=function() {
       document.getElementById('myimg').className='image-width';
      }
     }
       window.addEventListener?
       window.addEventListener('load',init,false):
       window.attachEvent('onload',init);
    </script>
    
    </head>
    <body>
    
    <h4 id="myh4">text</h4> 
    
    <div>
     <img id="myimg" src="image.png" alt="">
    </div>
    
    </body>
    </html>
    
    coothead


  •  

    Posting Permissions

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