jquery - 使用 $(window).height 作为动画值

Question

我试图将窗口高度作为动画的值传递，但在这个 jQuery 函数中没有运气。有人可以告诉我我在这里做错了什么吗？

下面是我的代码和小提琴。

$("slice").onclick().animate(function() {
    $(this).animate({
        var theHeight = $(window).height();
        top: '+=theHeight',
    });

});

http://jsfiddle.net/rH4JJ/1/

Answer 1

你需要这样的东西吗？

$(".slice").click(function () {
    var theHeight = $(window).height();
    $(this).animate({
        top: '+=' + theHeight
    });
});

​演示 ：http: //jsfiddle.net/rH4JJ/4/

是的，为了确保，在上面的示例中，position: relative样式被添加到slice元素中。否则，改变top是没有意义的。

Answer 2

不起作用，因为它以大约六种不同的方式完全荒谬。

$('.slice').click(function() {
    var theHeight = $(window).height();
    $(this).animate({
        top: '+=' + theHeight
    });
});

您还必须提供slice元素position: relative以便能够为它们的位置设置动画。

Answer 3

除了 VisioN 的回答，请注意，您需要为元素提供一个开始的位置（注意他们添加了位置：相对于该小提琴中的 css）

Answer 4

您需要学习 CSS（div 的宽度为 100%）、jQuery 和 jsFiddle（在侧边栏中选择 jQuery）

$(".slice").on("click",function(){
    var theHeight = $(window).height();
    $(this).animate({
        top: "+="+theHeight
    });

});

编辑：我把 Div 放在绝对（通常）中，但从你的例子中相对更好。 http://jsfiddle.net/rH4JJ/16/