Toggle & animate div location, text displayed & graphic rotate
Hi All,
Here's what I'm trying to do: When someone clicks on plain text with div of "hdrlink", then div of "slideshow" will close up using toggle. At the same time also need div of "headerNav" to move up 300px. When the user clicks "hdrlink" again, then "slideshow" reappears and "headerNav" move back down 300px (starting position)
Here's the script:
<script type="text/javascript">
$j('#hdrlink').click(function(){
$j('#slideshow').toggle(800),
$j('#hdrlink').toggle(
function(){
$j('#headerNav').animate({margin-top:"-300px"},800);
},
function(){
$j('#headerNav').animate({margin-top:"0px"},800);
}
);
});
</script>
Can't figure out what is wrong with the script - can someone help correct it?
Also, need to toggle hdrlink text back and forth & would like to add a small graphic that rotates 180 on each toggle.
Thanks, Bill