IE8 alternatywa dla window.scrollY?

Question

Próbuję określić, ile pikseli w dół przewijałem przy użyciu window.scrollY. Ale nie jest to obsługiwane w IE8. Jaka jest bezpieczna alternatywa dla różnych przeglądarek?

Answer 1

Wersja kompatybilna z przeglądarką dla window.scrollY to document.documentElement.scrollTop. Informacje na temat pełnego, szczegółowego obejścia tego problemu w IE8 i wcześniej można znaleźć w sekcji "Uwagi" tego utworu Mozilla documentation.

As mentioned here, pageYOffset to kolejna alternatywa dla window.scrollY (pamiętaj jednak, że jest to zgodne tylko z IE9 +).

W odniesieniu do linku powyżej, sprawdź Przykład 4 w pełni kompatybilnym sposób, aby uzyskać pozycję przewijania (nawet stanowi zoom jako @adeneo wymienić!) Używając document.documentElement.scrollTop i document.documentElement.scrollLeft.

Here, try out the example for yourself!

Answer 2

Jeśli masz ważny powód nie tylko przy użyciu biblioteki do obsługi tego rodzaju funkcjonalności bazowego, nie wahaj się „aby nie wymyślać koła”.

Mootools is open source, a może po prostu „ukraść” jego wykonania, odpowiednie fragmenty:

getScroll: function(){ 
    var win = this.getWindow(), doc = getCompatElement(this); 
    return {x: win.pageXOffset || doc.scrollLeft, y: win.pageYOffset || doc.scrollTop}; 
} 

function getCompatElement(element){ 
    var doc = element.getDocument(); 
    return (!doc.compatMode || doc.compatMode == 'CSS1Compat') ? doc.html : doc.body; 
} 

Te 2 są podstawą oceny, który tryb zgodności, Twoja przeglądarka musi, a następnie, czy użyć window.pageYOffset lub document.body.scrollTop w oparciu o to lub nawet document.html.scrollTop dla naprawdę starożytnych przeglądarek buggy.

Answer 3

Jeśli używasz jQuery, użyłem $ (window) .scrollTop(), aby uzyskać pozycję Y w IE 8. Wydawało się, że działa.

Answer 4

podstawie odpowiedzi Niels', wymyślić nieco bardziej kompaktowe rozwiązanie, gdy potrzebne jest tylko coord Y:

function get_scroll_y() { 
    return window.pageYOffset || document.body.scrollTop || document.html.scrollTop; 
} 

Answer 5

Jeśli nie masz go używać dużo, po prostu zrobić:

var scroll = 
    window.scrollY //Modern Way (Chrome, Firefox) 
|| window.pageYOffset (Modern IE, including IE11 
|| document.documentElement.scrollTop (Old IE, 6,7,8) 

Answer 6

W kanciasty, używamy:

var windowEl = angular.element($window); 
    scrolldist = windowEl.scrollTop(); 

Answer 7

podstawie Mozilla i odpowiedzi powyżej, mam stworzył bel funkcje ow łatwiej uzyskać coords:

var windowEl = (function() { 
    var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat"); 
    function scroll() { 
     return { left: scrollLeft, top: scrollTop }; 
    }; 
    function scrollLeft() { 
     return window.scrollX || window.pageXOffset || (isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft); 
    }; 
    function scrollTop() { 
     return window.scrollY || window.pageYOffset || (isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop); 
    }; 
    return { 
     scroll: scroll, 
     scrollLeft: scrollLeft, 
     scrollTop: scrollTop 
    } 
})(); 

Według Mozilla documentation, cytowany przez wcieleń powyżej, The nieruchomość pageXOffset jest aliasem dla właściwości scrollX, więc jest stictly mówiąc nie jest to konieczne.

Anyhoo, użycie jest:

var scroll = windowEl.scroll(); 
// use scroll.left for the left scroll offset 
// use scroll.top for the top scroll offset 

var scrollLeft = windowEl.scrollLeft(); 
// the left scroll offset 

var scrollTop = windowEl.scrollTop(); 
// the top scroll offset 

Testowane & prace nad Chrome, Firefox, Opera, EDGE (8-Edge), czyli (7-11), IE8 na XP

Answer 8

window.scrollY & window.scrollX działa dobrze we wszystkich nowoczesnych przeglądarkach, takich jak (Chrome, FireFox & Safari), ale nie działa w IE, więc napraw okno window.pageXOffset lub window.pageYOffset.

Oto przykładowy kod pisałem naprawić czyli problem tak, że programowy przewijanie działa we wszystkich przeglądarkach, w tym IE

if((window.scrollY || window.pageYOffset) >= 1100){ 
    //alert('Switch to land'); 
    $('#landTrst').trigger('click'); // your action goes here 
}else if ((window.scrollY || window.pageYOffset) <= 900) { 
    //alert('Switch to Refernce Letter'); 
    $('#resLet').trigger('click'); // your action goes here 
}