1

http://jsfiddle.net/ZGnTe/

    function iphoneAnimate() {
        $('.iphone-screen div').repeat().css({
        opacity: 0,
        top: 0
    })
        .each($).fadeTo(1000, 1).animate({
        top: $('.iphone-screen').height() - $(this).find('img').height()
    }, 4000).fadeTo(1000, 0, $);
}

iphoneAnimate();

$(this) 没有返回包含图像的 div。当我尝试在 $(this) 中获取 img 标签的高度时，它根本没有返回任何值。我正在使用 jquery-timing 插件，但我相信问题在于我的语法而不是插件。不确定。

最高值应为负数。例如 .iphone-screen (577) 的高度减去当前 div 图像的高度（第一个是 1375）。这应该为它的图像 div 设置动画，以便它几乎到达屏幕中图像的底部。

4

3 回答 3

0

也许是因为您传递给 .animate() 函数的属性不是函数本身。

尝试可以达到相同结果的不同选择器，例如

function iphoneAnimate() {
    $('.iphone-screen div').repeat().css({
        opacity: 0,
        top: 0
    })
        .each($).fadeTo(1000, 1).animate({
        top: $('.iphone-screen').height() - $('div img').height()
    }, 4000).fadeTo(1000, 0, $);
}

这是小提琴的链接：http: //jsfiddle.net/ZGnTe/1/


我认为“this”对象只能在回调函数中访问。

为了弥补“div img”选择器的通用性，您可以添加一个过滤器（例如.filter(":animated")）以仅获取正在动画的项目。

我建议扩展您的每个功能，如下例所示：（https://api.jquery.com/each/#example-1）。

于 2014-03-27T15:47:16.977 回答
0

我的意思是，表达式 $(this) 正在 iPhoneAnimate 方法的上下文中进行评估。由于您在没有特定上下文的情况下调用该方法，因此这不会评估任何内容。

如果您从委托或匿名方法中访问它，它将被评估为 jquery 对象的上下文。

于 2014-03-27T16:44:41.747 回答
0

您需要在链接元素之一之后使用回调函数，否则这些值仅计算一次。

function iphoneAnimate() {
    $('.iphone-screen div').repeat().css({
        opacity: 0,
        top: 0
    })
    .each($)
    .fadeTo(1000, 1)
    .then(function(){ 
        $(this).animate({top: $('.iphone-screen').height() - $(this).height()
                                                              },4000);})
    .fadeTo(1000, 0, $);
}

iphoneAnimate();

工作演示：http: //jsfiddle.net/ZGnTe/2/

于 2014-03-28T18:04:06.127 回答