How to show content when the page is scrolled?
14
I want to create a scroll-triggered animation where a div element becomes visible when the user scrolls down to a certain percentage of the page (like 10% or 50%).
How can I implement this functionality using JavaScript? I'd prefer a solution that works with vanilla JavaScript or jQuery.
50 reputation
1 Answer
0
To show content when screen is scrolled.
Use CSS property display: none; and display: block; or use visibility: hidden; and visibility: visible;.
Choose either method depending on your requirement.
This can be done using JQuery!
<script> $(window).scroll(function() { if ($(window).scrollTop() >= 400) { $("#id").css("display", "block"); } else { $("#id").css("display", "none"); } });</script>
Try this.
answered 3 years ago