jQuery向上动画

jQuery向上动画,jquery,css,jquery-animate,Jquery,Css,Jquery Animate,我有一个问题,我有一个绝对定位的div,我想在页面上设置动画(我正在设置一个人从屏幕上跳下的动画) 但是,我需要元素为bottom:0,但是当我希望动画完成时,我希望图像具有top:-600px 当我写作时 $("#jumper").animate({ top: "-600px" }, 2000, 'easeInBack' ); 它将top设置为0,然后开始动画 也许有一种方法可以获取元素的ypo,并在窗口加载时使用jQuery.css()设置top 我应该在这里做什么?下面是

我有一个问题,我有一个绝对定位的div,我想在页面上设置动画(我正在设置一个人从屏幕上跳下的动画)

但是,我需要元素为bottom:0,但是当我希望动画完成时,我希望图像具有top:-600px

当我写作时

$("#jumper").animate({ 
    top: "-600px"
}, 2000, 'easeInBack' );   
它将top设置为0,然后开始动画

也许有一种方法可以获取元素的ypo,并在窗口加载时使用jQuery.css()设置top


我应该在这里做什么?

下面是一个代码示例:


看起来像我期望的那样工作。可能有其他东西在干扰..

如何设置
底部属性的动画?您可以获取文档的高度,然后将
600
添加到文档中

否则,您将遇到特定于浏览器的问题,其中
顶部
被计算为
自动
,动画将尝试从该位置开始(我猜最终为0)

要实现这一点,您必须在设置动画之前获得
#jumper
的顶部位置,并手动将
top
属性设置为该值

var top = $('#jumper').offset().top;

$("#jumper").css({top:top, bottom:'auto'})
.animate({ 
    top: -600
}, 2000, 'easeInBack' ); 
编辑:第二个示例要求
bottom
也设置为
auto

它似乎对我不起作用。顺便说一下,我用的是Chrome,但这不重要。
var top = $('#jumper').offset().top;

$("#jumper").css({top:top, bottom:'auto'})
.animate({ 
    top: -600
}, 2000, 'easeInBack' );