住检测浏览器尺寸 - 的jQuery / JavaScript的 [英] Live Detect Browser Size - jQuery / JavaScript

问题描述

有一个jQuery插件，或者使用直接的JavaScript来检测浏览器大小的方法。

Is there a jQuery plugin or a way using straight JavaScript to detect browser size.

我倒是preFER它的结果是活的，因此，如果宽度或高度的变化，因此会的结果。

I'd prefer it is the results were 'live', so if the width or height changes, so would the results.

推荐答案

的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

的jsfiddle演示

编辑：更新JavaScript的code：支持IE8和更早

Updated the JavaScript code to support IE8 and earlier.

这篇关于住检测浏览器尺寸 - 的jQuery / JavaScript的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！