How to move an entire div element up x pixels?
$('#div_id').css({marginTop: '-=15px'});
This will alter the css for the element with the id "div_id"
To get the effect you want I recommend adding the code above to a callback function in your animation (that way the div will be moved up after the animation is complete):
$('#div_id').animate({...}, function () {
$('#div_id').css({marginTop: '-=15px'});
});
And of course you could animate the change in margin like so:
$('#div_id').animate({marginTop: '-=15px'});
Here are the docs for .css()
in jQuery: http://api.jquery.com/css/
And here are the docs for .animate()
in jQuery: http://api.jquery.com/animate/
$('div').css({
position: 'relative',
top: '-15px'
});
In css add this to the element:
margin-top: -15px; /*for exact positioning */
margin-top: -5%; /* for relative positioning */
you can use either one to position accordingly.