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 3 of 3
  1. #1
    New Coder
    Join Date
    May 2010
    Posts
    43
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Question Changing Margins with onClick??

    Hello,

    I have a div called pageWrap to wrap my page with the css as
    Code:
    margin-top:-46px;
    I would like to use Javascript onClick on another div.
    This Div is called loginButton, the onclick should change the the css of pageWrap to 0px and onclick again should change it back.

    If someone could help me with this code, it would be greatly appreciated

    Thanks in advance!

  • #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:
    <script type="text/javascript">
    onload=function(){
    var login=document.getElementById('loginButton');
    var target=document.getElementById('pageWrap');
    login.onclick=function(){
    target.style.marginTop=target.style.marginTop=='0px'?'-46px':'0px';
    }
    }
    </script>
    Important: Regarding those DIV's, I hope that by "called" you mean "they have an id".

    And a small note: never throw thanks in advance. This is not the Bawdy House
    Last edited by Kor; 07-29-2010 at 04:26 PM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • Users who have thanked Kor for this post:

    Vizard-Coder (07-30-2010)

  • #3
    New Coder
    Join Date
    May 2010
    Posts
    43
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Smile

    Thank you that is exactly what I wanted!

    Now it may not be part of this thread but how do I make it so it slides down??
    Or is that too complex?


  •  

    Tags for this Thread

    Posting Permissions

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