inhinfecisorn
New Member
I am trying to Animate a div's top position by -130px, so it will move off screen. Its not working and i cant workout why! Am obviously a jQuery/Javascript novice. Basically i have a button/hyperlink with the id #NavShrink, on clicking this i want the div #Header to slide up off screen by 130px, leaving its bottom 20px on screen.Nothing happens!Here's my code:\[code\]<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Title</title><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script><style type="text/css">body {padding:0px;margin:0px;font-family: Helvetica, sans-serif;font-size:11px;color:#7b7a7a;}#Header {height:150px;background-color:#f4f4e9;}#MainNav {padding:20px 20px 0px 20px;width:1140px;margin-left:auto;margin-right:auto;text-align:right;position:relative;height:130px;}a#NavShrink {display:block;width:15px;height:15px;background-image:url(../images/ShrinkNav.png);position:absolute;bottom:5px;right:0px;}</style></head><body><div id="Wrap"><div id="Header"> <div id="MainNav"> <script language="javascript" type="text/javascript"> $('#NavShrink').click(function() { $('#Header').animate({ top: "-=130px"}) }) </script> <a href="http://stackoverflow.com/questions/12789151/#Shrink" id="NavShrink"></a></div></div></div></body>\[/code\]