How to stop $ (window) .scroll in an on-demand query

2

I make an on-demand query on my page, I bring the information from the database as the user uses the scroll.

$(window).scroll(function(evento){
    evento.preventDefault();
    var init = $(".canal .lista ul#dem").length;
    carregar(init + 1, init + 2, 'lista_load.asp');
});

The problem is that I do not know how to stop the scroll, I do a check, I did a validation so that when I arrived at the end of the items I would show an alert, and it worked fine, I wanted at that point that the scroll function stopped bringing s items, but I do not know how to do it, can anyone help me?

    
asked by anonymous 17.07.2015 / 22:33

1 answer

0

Event scroll can not cancel. This is very clear in the W3C specification .

The only ways I know to get around this are:

  • overflow: hidden;
  • an event dropper that forces the scroll position to not change

The first option to give overflow: hidden; in the body is often used in cases where scroll should not happen. In your case you want the scroll to work until a certain time and then stop working. To use this idea you have to read the scroll position and apply overflow: hidden; to body or parent element of the other.

Example:

CSS

div {
    height: 4000px;
    border: 1px solid #ccf;
}
.pararScroll {
    overflow: hidden;
    background-color: #eee;
}

JS

window.addEventListener('scroll', function (e) {
    var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
    if (scrollTop > 1000) document.body.classList.add('pararScroll');
});

jsFiddle: link

The second option needs you to save the value of the last scroll position. So at every scroll event, you say again that the position should be the previous to that scroll event.

Example:

var lastScroll;
window.addEventListener('scroll', function (e) {
    if (lastScroll) return window.scrollTo(0, lastScroll);

    var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
    if (scrollTop > 1000) lastScroll = scrollTop;
});

jsFiddle: link

And if you want to re-enable scroll, you only have to change the value of lastScroll to a value that has boolean false .

    
18.07.2015 / 01:30