Próbuję zaimplementować zsynchronizowane przewijanie dla dwóch osóbDIV z następującym kodem.

PRÓBNY

$(document).ready(function() {
    $("#div1").scroll(function () { 
        $("#div2").scrollTop($("#div1").scrollTop());
    });
    $("#div2").scroll(function () { 
        $("#div1").scrollTop($("#div2").scrollTop());
    });
});

#div1 i#div2 ma taką samą treść, ale, powiedzmy, różne rozmiary

#div1 {
 height : 800px;
 width: 600px;
}
#div1 {
 height : 400px;
 width: 200px;
}

Z tym kodem stoję przed dwoma problemami.

1) Przewijanie nie jest dobrze zsynchronizowane, ponieważ div mają różne rozmiary. Wiem, to dlatego, że bezpośrednio ustawiamscrollTop wartość. Muszę znaleźć procent przewijanej zawartości i obliczyć odpowiedniescrollTop wartość dla drugiegodiv. Nie jestem pewien, jak znaleźć rzeczywistą wysokość i aktualną pozycję przewijania.

2) Ten problem występuje tylko wfirefox. W Firefoksie przewijanie nie jest płynne, jak w innych przeglądarkach. Myślę, że ponieważ powyższy kod tworzy nieskończoną pętlę zdarzeń przewijania. Nie jestem pewien, dlaczego tak się dzieje tylko z firefoxem. Czy istnieje sposób na znalezienie źródła zdarzenia scroll, dzięki czemu mogę rozwiązać ten problem.

Każda pomoc byłaby bardzo mile widziana.