當元素在屏幕上顯示60％時，WOW.js開始動畫

Question

使用WOW.js，當元素的X％可見而不是使用偏移值時，是否可以啓動動畫？

例如我有一個寬度和高度爲300px的元素，並且如果將X％設置爲50％，則當用戶滾動到足以在屏幕上顯示150px的元素時，動畫將啓動。

Answer 1

我查看了WOW.js的源代碼，看起來好像沒有辦法以百分比的方式指定偏移量，而不是以像素爲單位。所以這裏是如何在JavaScript中做到這一點：

window.onload = function() { 
    var elements = document.getElementsByClassName("offsetme50"); 
    var i; 
    for (i = 0; i < elements.length; i++) { 
     var offset = elements[i].clientHeight * .5; //.5 = 50% 
     elements[i].setAttribute("data-wow-offset", offset); 
    } 
} 

此代碼將在頁面加載後自動運行。將class="offsetme50"設置爲所需的所有HTML元素。