動畫框陰影可見時

我們有一個圖像，並希望通過向其添加類時在頁面上可見時爲它的框陰影設置動畫。以下代碼適用於其他元素，但它們不會將該類添加到我們想要的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之間的兄弟姐妹 - 右邊，更新了答案。 –

動畫框陰影可見時

回答

相關問題