2017-03-06 74 views
0

當滾動瀏覽頁面中的某個點時,我想要觸發一些動畫。如何觸發滾動功能

我不認爲我有正確的語法用scrollTop屬性調用我的動畫函數。我用警報測試了它,它工作正常。

var illustArr = ['map', 'privacy', 'payment', 'rewards', 'security', 'passcode']; 
var illust; 

function addListenerToElement(e, anim){ 
    document.getElementById(e).addEventListener('mousedown', function() { 
    anim.play(); 
    anim.addEventListener('complete', function(){anim.goToAndStop(0,true)}); 
    } 
)}; 

function buildIllus(){ 
for(var i=0;i<illustArr.length;i+=1){ 
    illust = document.getElementById(illustArr[i]); 
    var params = { 
     container: illust, 
     autoplay: false, 
     loop: false, 
     animationData: animations[illustArr[i]], 
     renderer: 'svg' 
    }; 

    var anim = bodymovin.loadAnimation(params); 

    illustArr.forEach(function (e) { 
     addListenerToElement(e, anim) 
     }) 
} 
}; 

window.onscroll = function() {myFunction()}; 

function myFunction() { 
if (document.body.scrollTop > 50) { 
    anim.play 
}} 

buildIllus(); 

感謝

回答

0

也許改變anim.playanim.play()

function myFunction() { 
    if (document.body.scrollTop > 50) { 
     anim.play(); // this line 
    } 
}