代码之家  ›  专栏  ›  技术社区  ›  maletor anon

jquery向上动画

  •  1
  • maletor anon  · 技术社区  · 14 年前

    我有一个问题,我有一个DIV,它的位置是不确定的,我想让它从页面上向上移动(我正在让一个人从屏幕上跳下来)。

    但是,我需要元素是底端:0,但是当我希望动画完成时,我希望图像具有顶端:600px。

    当我写作的时候

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

    它将Top Top设置为0,然后启动动画。

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

    我该怎么办?

    2 回复  |  直到 14 年前
        1
  •  2
  •   user113716    14 年前

    那就给它设置动画怎么样? bottom 财产?您可以获取文档的高度,然后添加 600 对它。

    http://jsfiddle.net/kavY4/

    var height = $(document).height();
    
    $("#jumper").animate({ 
        bottom: height + 600
    }, 2000, 'easeInBack' ); ​
    

    否则,会遇到浏览器特定的问题,其中 top 计算结果为 auto 动画试图从那个位置开始(我猜最后是0)。

    要想做到这一点,你必须获得 #jumper 并设置 顶部 在设置动画之前手动将属性设置为该值。

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

    编辑: 第二个示例是必需的 底部 被设定为 汽车 也。

    http://jsfiddle.net/kavY4/1/

        2
  •  0
  •   Gabriele Petrioli    14 年前

    下面是代码示例: http://www.jsfiddle.net/fJKah/

    看起来像我期望的那样工作。也许是别的什么干扰了……