Question

Is there any way to prevent firing onscroll event when setting scrollTop property?

var a = $(".elem");
a.scrollTop(100); // will fire onScroll

Thanks.

Answer 1

This code is kind of hackish but it gets the job done:

var p1 = $('.one'), p2 = $('.two');
//var lock;
$('p').scroll(function() {
    //if (lock) return;
    //lock = true;
    var scrollTop = $(this).scrollTop();
    var other = $(this).hasClass('one') ? p2 : p1;
    other.scrollTop(300 - scrollTop);
    console.log('To:', 300 - scrollTop);
    //lock = false;
});​

A basic assumption that we all seem to make is that the events will run at the same time, but on closer inspection we realize that Javascript runs on a single thread, meaning they will not run simultaneously. The commented out lock functionality is therefore useless. If you’re just trying to synchronize scrolling, the above code should work fine, but I’m honestly not too sure how to proceed from there.