简体   繁体   中英

Detect scrolling - scroll to div

I'm trying to make a site whereby when the user starts to scroll it automatically scrolls them (not jump) to a set position, so that content can be seen. The content is already there on the page I just dont want them to scroll to it so as soon as they start to move down the page it will help them by scrolling to a set point.

This is what I had so far but I got lost:

<script type="text/javascript">
$(body).scroll(function() {
    if ( $this).scrollTop() > 1 ) {

    }
});
</script> 

Here's a fiddle

var scrollFunction = function() {
    $('html, body').not(':animated').animate({
        scrollTop: $("#layer-2").offset().top //gets the position of the next layer
    }, 1000, function() {
        $(document).off('scroll', scrollFunction)
    });
}

$(document).on('scroll', scrollFunction);

You can bind your element with scrollstart (also there is a scrollstop ) event:

jQuery('#yourElementId').bind("scrollstart",scrollFunc);

var scrollFunc = function(){
  //if(jQuery('#yourElementId').scrollTop()>1) //unnecessary 
  jQuery('#yourElementId').scrollTop(300); // change 300 to any number you want
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM