Uzyskiwanie wysokości i szerokości bryły lub okna strony internetowej

Question

W zależności od trybu IE8, w którym się znajduję (dziwactwa lub standard), otrzymuję różne wartości dla wysokości i szerokości. Próbowałem standardowego javascript i jquery, ale oba zwracają różne wyniki.

W dziwactwa

$('body').width = 1239 
$('body').height = 184 
document.body.clientWidth = 1231 
document.body.clientHeight = 176 

w normach

$('body').width = 1260 
$('body').height = 182 
document.body.clientWidth = 1254 
document.body.clientHeight = 176 

pomysłów jak zdobyć wartość niezmienioną przez trybie IE8.

Dzięki za przysł.

Answer 1

Być może problem wynika z przewijania wchodzących w szerokości i wysokości, niezależnie od tego, czy są one tam. Nie mam IE (na komputerze Mac), więc nie mogę zweryfikować.

Mogę jednak powiedzieć, co działa tak, jak w moim projekcie. jQuery Lightbox Nie mam takiego problemu. Używamy w nim następującego kodu:

// Make the overlay the size of the body 
var $body = $(this.ie6 ? document.body : document); // using document in ie6 causes a crash 
$('#lightbox-overlay').css({ 
width: $body.width(), 
height: $body.height() 
}); 

// ... some code ... 

// Get the window dimensions 
var $window = $(window); 
var wWidth = $window.width(); 
var wHeight = $window.height(); 

Nakładka wyświetla się poprawnie. Ufałbym wynikowi jQuery wynikającemu z szerokości i wysokości w porównaniu z wynikiem natywnym, ponieważ jQuery powinna naturalnie uwzględniać wszelkie dziwactwa z przeglądarką.

Należy pamiętać, że powyższy skrypt lightbox zazwyczaj z jakiegoś powodu woli $(document) niż $(document.body) - nie pamiętam, przepraszam: O - więc może to rozwiązuje problem?

Answer 2

Tylko szybki róg. Spróbuj dać #page ciała:

function getPageHeight() { 
    var pageHeight = document.getElementById('page').offsetHeight; 
    var pageWidth = document.getElementById('page').offsetWidth; 

    alert(pageHeight); 
    alert(pageWidth); 
} 

Answer 3

Spróbuj tego:

var viewport = { 
    width : $(window).width(), 
    height : $(window).height() 
}; 

var width = viewport.width; 
var height = viewport.height;