滾動顯示不能正常工作

在閱讀THIS教程並使用他們的代碼後，我試圖使用scrollReveal.js，但是當我的視口位於它們上面時，我仍然無法讓我的div淡入。滾動顯示不能正常工作

的Html

<head> 
<script src="scrollreveal-master/dist/scrollreveal.min.js"></script> 
</head> 

<div data-sr>This is the first div</div> 
<div data-sr>This is the second div</div> 
<div data-sr>This is yet another div</div>

的JavaScript

new scrollReveal();

當我在我的網頁上查看控制檯，它說

「未捕獲的ReferenceError：scrollReveal沒有定義」

來源

2016-11-16 Rhys Edwards

，能得到任何其他錯誤，如一個404錯誤？你的代碼在哪裏？ *在您加載'scrollreveal.min.js'之後它來了嗎？此外，該網站似乎有一個錯字。它應該是'新的ScrollReveal（）' –

我只收到一個錯誤（「參考錯誤」）。而我的代碼是在我的身體標記的末尾，我在我的頭部開始加載scrollReveal。 –

@RhysEdwards嘗試在頁面末尾的腳本之前加載庫 – Alexis

嘗試這樣使用scrollReveal

<!DOCTYPE html> 
<html> 

    <head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <link rel="stylesheet" href="style.css" /> 


</head> 

<body> 

<div id="main"> 

<div data-sr> one </div> 
<div data-sr> two </div> 
<div data-sr> three </div> 

</div> 

<script src="https://unpkg.com/[email protected]/dist/scrollreveal.min.js"></script> 

<script> 

// Changing the defaults 
window.sr = ScrollReveal({ reset: true }); 

// Customizing a reveal set 
sr.reveal('div', {opacity: 0.9,duration:3000}); 

</script> 

</body> 

</html>

工作實例上滾動添加動畫：https://plnkr.co/edit/qC33zle0fafyAL0RjkVl?p=preview

來源

2016-11-16 16:19:25 Deep

滾動顯示不能正常工作

回答

相關問題