页面大小改变实施特定函数

页面大小改变执行特定函数

HTML code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        window.onresize = function () {
            alert(2222);
        }
        $(window).resize(); 
    </script>
</head>
<body>
    <div id="test" style="border: 2px solid rgb(17, 70, 135); width:200px; height:300px;">

    </div>
    <input type="button" value="点击" onclick="document.getElementById('test').style.display = 'none';" />
</body>
</html>

我想实现页面大小发生改变时，就执行指定的函数，
可是上面的代码只在加载页面时执行一次(点击不执行)，请教大家有什么其他的实现方法吗？谢谢！

------解决方案--------------------
window.onload = function(){
window.onresize = func;
}

function func(){
//执行代码
}

我觉得这样写看着比较直观~~
------解决方案--------------------
浏览器右上角有最大化按钮。点击那个按钮看效果。
或者拖动浏览器右下角
------解决方案--------------------
你不是要在页面大小改变时执行代码么？点击时本来就不该执行啊
直接
window.onresize = function () {
alert(2222);
}

已经可以了，你拖动浏览器边框或点击最大话/正常大小按钮都会弹出2222了
$(window).resize();这句已经多余
------解决方案--------------------
<script type="text/javascript">
window.onresize = function (){
alert(2222);
};//这里漏写个分号
window.resize();
</script>

页面大小改变实施特定函数

相关推荐