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
    Jul 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    If statement to minimize and maximize image

    I am new to this and I am pretty lost, basically I want the div to start out completely minimized at 0% height and then when I click the button that calls the function it should increase the size to 100%, once it is maximized I want it to set the height back to 0% when the button is clicked again. Heres what I have so far. I can get it to minimize and maximize itself but I can't get the height set correctly.

    Code:
    <SCRIPT language="javascript"> 
    
    
    var y = 100;
    var q = 5;
    var f = 0;
    var g = 0;
    
     
    function changeheight(){
    if(y>170&&g==0){g=1;return;}
    if(y<101&&g==1){g=0;return;}
    if(g)q=-5;if(!g)q=5;y=y+q;
     e=document.getElementById("examplediv");
     e.style.height = y + 'px';
     t=setTimeout("changeheight();",0);
    
    </SCRIPT>
    Can anyone help me out, or is there an easier way to do this?

  • #2
    Regular Coder
    Join Date
    Feb 2010
    Posts
    104
    Thanks
    5
    Thanked 3 Times in 3 Posts
    Replace 'yourElement' with the id of your image.

    Code:
    function changeHeight(){
         var element = document.getElementById('yourElement');
         if(element.style.height == "100%"){element.style.height = "0%";}
         else{element.style.height = "100%";}
    }

    and set your images CCS style to your starting percentage as shown below.
    Code:
        <img src="abc.jpg" id="yourElement" style="height:100%;" />


  •  

    Posting Permissions

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