2013-07-16 10 views
9

Właśnie odkryłem i naprawdę podoba mi się getBoundingClientRect, ponieważ zawiera precyzję subpikselową. To pozwoliło mi na stworzenie spójnego wyrównanie, nawet jeśli użytkownik wpisze Ctrl+ lub Ctrl + -.Obsługa przeglądarki we właściwościach width i height getBoundingClientRect?

Posiada właściwości top, bottom, left, right, & width & height.

Łatwo jest znaleźć wsparcie przeglądarki w Internecie, ale nie tak bardzo, szczególnie w przypadku właściwości width i height. Wygląda na to, że został dodany po fakcie. Działa w przeglądarkach Firefox, Chrome i IE10, ale co z IE8 & IE9? Nie mogę tego przetestować wygodnie.

+0

można używać programista w IE10, aby umieścić go w trybie IE8? (Nie jestem pewien, czy IE10 może to zrobić, ale IE9 w trybie IE8 prawdopodobnie uzyskałoby coś podobnego.) – Pointy

+0

Czy też "szerokość" różni się od "prawej - lewej"? – Pointy

+0

* "używaj rzeczy programistycznych" * Historycznie narzędzia F12 w IE potrafiły dokładnie odzwierciedlać poprzednie parsery HTML i CSS, ale zauważyłem, że nie działa dokładnie na starych interpretatorach JavaScript. –

Odpowiedz

9

W IE9 jak IE8:

document.body.getBoundingClientRect() 
[object] { 
    right : 2556, 
    top : 0, 
    bottom : 1195, 
    left : 0 
} 

W IE9 jak IE9:

document.body.getBoundingClientRect() 
[object ClientRect] { 
    bottom : 1435, 
    height : 1435, 
    left : 0, 
    right : 2544, 
    top : 0, 
    width : 2544 
} 

Więc powiedziałbym tak na IE9, nie na IE8 ...

+2

IE 7 również nie obsługuje szerokości i wysokości. Dzięki Microsoft za jankowe doświadczenie w programowaniu! – Phil

+1

Odkryliśmy, że prawo-lewo w IE8 jest wykonywane jako liczba całkowita, podczas gdy szerokość w IE9 może być zmiennoprzecinkową. Połowa piksela może być znaczna, jeśli próbujesz wyrównać dwa elementy na stronie. –

Powiązane problemy