检查浏览器视口大小


<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>浏览器视口大小检查title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"/>
head>
<body>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js">script>
<script>
    // 浏览器加载时
    $(document).ready(function(e) {
        showViewportSize();
    });
    // 浏览器窗口缩放时
    $(window).resize(function(e) {
        showViewportSize();
    });
    function showViewportSize() {
        var the_width = $(window).width();
        var the_height = $(window).height();
        $('#width').text(the_width);
        $('#height').text(the_height);
    }
script>
<h1>视口大小h1>
<h2>视口 Width:h2>
<p id="width">Resize to find out!p>
<h2>视口 Height:h2>
<p id="height">Resize to find out!p>
body>
html>

你可能感兴趣的:(html)