scroll animation content in the website from left/top/right/bottom
Faisal Ahmed
Posted on January 21, 2023
website: https://scrollrevealjs.org/
add this link in the html page:
<script src="https://unpkg.com/scrollreveal"></script>add this code in the js file(just change the classname):
syntax:sr.reveal('.classname',{ delay: 200, origin: 'top' })
// scrollreveal
const sr = ScrollReveal({
distance: '60px',
duration: 2500,
delay: 400,
reset: true
})
sr.reveal('.text',{ delay: 200, origin: 'top' })
sr.reveal('.form-container form', { delay: 800, origin: 'left' })
sr.reveal('.heading', { delay: 800, origin: 'top' })
sr.reveal('.ride-container .box', { delay: 600, origin: 'top' })
sr.reveal('.services-container .box', { delay: 600, origin: 'top' })
sr.reveal('.reviews-container .single-review', { delay: 600, origin: 'top' })
sr.reveal('.newsLetter-container', { delay: 600, origin: 'right' })
sr.reveal('.copyright-icons .bx', { delay: 800, origin: 'left' })
💖 💪 🙅 🚩
Faisal Ahmed
Posted on January 21, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
