jQuery scrollTop niespójne w różnych przeglądarkach

Question

W przeglądarce Chrome i Safari $("body").scrollTop(1000) przechodzi w oczekiwany sposób.

W IE i FF nic się nie dzieje.

W IE i FF, $(window).scrollTop(1000) działa, ale trafiają do różnych miejsc. Działa również w przeglądarce Chrome i Safari, ale obie są również dostępne w innym miejscu. Wygląda na to, że mają nawet 300-500 pikseli.

Czy istnieje jakiś spójny sposób ustawienia właściwości scrollTop, która działa w przeglądarce, a jeśli nie, dlaczego jQuery nie streści tego?

Chciałbym go również ożywić, co działa dobrze w Chrome i Safari, ale nie w innych przeglądarkach.

Czy moja jedyna opcja umożliwia wykrywanie przeglądarki? (Zła praktyka) Czy jest jakiś lepszy sposób?

Answer 1

Spróbuj

$(document).scrollTop("..."); 

Answer 2

$(jQuery.browser.webkit ? "body": "html").animate({ scrollTop: myTop }, myDur);

przeglądarek Webkit (Chrome/Safari, Mac i Win) użyć "ciało", inni (FF/Opera/IE 7-9) używać "html"

Muszę kochać wykrywanie przeglądarki.

Answer 3

Musisz zastosować scrollTop do body lub html w zależności od przeglądarki, ale nie zaszkodzi zastosowanie go do obu. Od .scrollTop() dotyczy pierwszej elementu w zestawie, ale .animate() dotyczy wszystkich elementów, można to zrobić:

$('body, html').animate({ 
    scrollTop: 1000 
}, 'fast'); 

Jeśli chcesz zmiana natychmiast zastosować, zmienić prędkość ('fast') do 0. Alternatywnie możesz użyć następującego, ale lubię powyższą składnię lepiej:

$('body, html').each(function() { $(this).scrollTop(1000); });