How to use scroll to top function using jquery

Question

How can I make an effect when mouse scrolls to a particular position?

<div id="target">
  <!-- some data here -->
</div>

jQuery

var target = $('#target');

if(target.scrollTop() > 10){
  alert('');
}

Do you mean when the mouse scrolls or when the window scrolls? — David, Aug 14 '15 at 15:37
Where is your js code placed ? if you want to do something when an element is scrolled, you need to use the scroll event : `$(window).scroll(function() { console.log("scrolled"); });` — KVM, Aug 14 '15 at 15:38
maybe you can use some existing plugin e.g. https://github.com/Mottie/visualNav — areim, Aug 14 '15 at 15:39
Possible duplicate of [check if element got scrolled to top](http://stackoverflow.com/questions/18961151/check-if-element-got-scrolled-to-top) — Heretic Monkey, Oct 24 '16 at 20:33

score 0 · Answer 1 · answered Oct 24 '16 at 20:37

You might have to select the entire HTML document for the scroll function, instead of just one specific div

jQuery

$(document).scroll(function(){  
    if ($(window).scrollTop() > 10){
      // if the current scroll of the window is greater than 10px
    alert('');
}
});

score 0 · Answer 2 · answered Jun 17 '18 at 15:05

You need to put your code inside $(window).on('scroll', function(){}); which will fire each time the window is scrolled like this:

    $(window).on('scroll', function(){
    var target = $('#target');
    if(target.scrollTop() > 10){
    console.log("Scrolled 10px");
    alert('');
       }
    });

How to use scroll to top function using jquery

2 Answers2