Gibt es ein jQuery-Plugin oder eine Möglichkeit, mithilfe von reinem JavaScript die Browsergröße zu ermitteln?
Ich würde es vorziehen, wenn die Ergebnisse "live" wären. Wenn sich also die Breite oder Höhe ändert, würden sich auch die Ergebnisse ändern.
6 Antworten
JavaScript
function jsUpdateSize(){
// Get the dimensions of the viewport
var width = window.innerWidth ||
document.documentElement.clientWidth ||
document.body.clientWidth;
var height = window.innerHeight ||
document.documentElement.clientHeight ||
document.body.clientHeight;
document.getElementById('jsWidth').innerHTML = width; // Display the width
document.getElementById('jsHeight').innerHTML = height;// Display the height
};
window.onload = jsUpdateSize; // When the page first loads
window.onresize = jsUpdateSize; // When the browser changes size
jQuery
function jqUpdateSize(){
// Get the dimensions of the viewport
var width = $(window).width();
var height = $(window).height();
$('#jqWidth').html(width); // Display the width
$('#jqHeight').html(height); // Display the height
};
$(document).ready(jqUpdateSize); // When the page first loads
$(window).resize(jqUpdateSize); // When the browser changes size
Bearbeiten: Der JavaScript-Code wurde aktualisiert, um IE8 und früher zu unterstützen.
Dies sollte den sichtbaren Bereich zurückgeben:
document.body.offsetWidth
document.body.offsetHeight
Ich denke das ist immer gleich der Browsergröße?
Meinst du so etwas window.innerHeight; window.innerWidth $(window).height(); $(window).width()
Sie können verwenden
function onresize (){
var h = $(window).height(), w= $(window).width();
$('#resultboxid').html('height= ' + h + ' width: ' w);
}
$(window).resize(onresize );
onresize ();// first time;
Html:
<span id=resultboxid></span>
Verwenden Sie die Variablen width und height an einer beliebigen Stelle. Wenn sich die Größe des Browsers ändert, ändert sich auch der Variablenwert.
$(window).resize(function() {
width = $(this).width());
height = $(this).height());
});
Sie können versuchen, den Ereignis-Listener bei Größenänderung wie hinzuzufügen
window.addEventListener('resize',CheckBrowserSize,false);
function CheckBrowserSize()
{
var ResX= document.body.offsetHeight;
var ResY= document.body.offsetWidth;
}