• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

JavaScript onClick Margins


I have a div called pageWrap to wrap my page with the css as
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!
$(document).ready(function() {    // When loginbutton is clicked toggle this function    $('#loginButton').toggle(function() {        // Animate #pageWrap's margin-top to 0 px over 1000ms        $('#pageWrap').animate({            margin-top: "0px",        }, 1000, function() {            // Animation Complete        })    // When #pageWrap is clicked again animate its margin-top to -46px over 2000ms    }, function() {        $('#pageWrap').animate({            margin-top: "-46px",        }, 2000, function() {            // Animation Complete        });    });});
This is done in jQuery btw, and isn't tested so it might not work first time :p