动画框阴影可见时

我们有一个图像，并希望通过向其添加类时在页面上可见时为它的框阴影设置动画。以下代码适用于其他元素，但它们不会将该类添加到我们想要的div中。也许.closest不是正确的选择。动画框阴影可见时

任何想法？

<div class="test-thewinner"> 
<img class="img-winner" src="xxx.png" alt="test-desktop"> 
<div class="test-shadow"></div> 
</div> 



       /* highlight border of winner */ 
    $('.img-winner').each(function(i){ 

     var bottom_of_object = $(this).offset().top + $(this).outerHeight(); 
     var bottom_of_window = $(window).scrollTop() + $(window).height(); 

     /* If the object is completely visible in the window, animate border or box shadow */ 
     if(bottom_of_window > bottom_of_object){ 

     $(this).closest('.test-shadow').addClass('greenit'); 

     } 

    });

来源

2016-07-22 trying_to_learn

尝试.siblings（ '测试阴影。 '） –

是最接近的是不是正确的选择，按照该文档

.closest（选择器）

对于组中的每个元素，即获得通过测试元件的选择相匹配的第一元素并通过DOM树中的其祖先遍历。

您可以使用。

$(this).siblings('.test-shadow:first').addClass('greenit');

来源

2016-07-22 19:18:38 Deep

工作完美！ –

肯定.closest不是正确的选择，因为它会搜索有问题的元素的父母。如果它们之间可能有兄弟姐妹，则将其更改为$(this).next().addClass('greenit');或$(this).next('.test-shadow').addClass('greenit');。

来源

2016-07-22 19:15:13

'。接下来（' 测试阴影。'）'如果有 – Aziz

@Aziz之间的兄弟姐妹 - 右边，更新了答案。 –

动画框阴影可见时

回答

相关问题