2016-11-16 4 views
1

Я пытаюсь использовать scrollReveal.js после прочтения THIS учебника и используя свой код, я все еще не могу заставить свои divs исчезать, когда мой видовой экран на них.Свиток показ не работает

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(); 

Когда я просматривать консоль на моем веб-странице он говорит

"Uncaught ReferenceError: scrollReveal не определен"

+0

Вы получаете какие-либо другие ошибки, как ошибка 404? Где ваш код? Он приходит * после * вы загружаете 'scrollreveal.min.js'? Кроме того, на этом сайте есть опечатка. Это должно быть 'new ScrollReveal()' –

+0

Я получаю только одну ошибку («ошибка ссылки»). И мой код находится в конце моего тега тела, и я загружаю scrollReveal в начале моей головы. –

+0

@RhysEdwards Попробуйте загрузить библиотеку перед вашим скриптом в конце страницы – Alexis

ответ

3

Попробуйте, как это, чтобы добавить анимацию на свитке с помощью 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

 Смежные вопросы

  • Нет связанных вопросов^_^