如何判断屏幕大小来自动执行js?_html/css_WEB-ITnose

想当屏幕宽度小于800px时自动隐藏div

回复讨论(解决方案)

登录后复制

var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;if(browserWidth  

借用楼上的代码,其实我的建议是这样,ie9以上css3的media可以实现楼主所说的效果。然后以下的用js实现,并且加上resize事件的绑定,要不然,隐藏之后窗口在拉大就不显示了。完整参考代码如下:

nbsp;html>                    @media screen and (max-width:800px) {            #div{ color:#f00;}        }        
this test div
function hideDiv(){ var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var div = document.getElementById("div"); if(browserWidth < 800){ div.style.display = "none"; } else { div.style.display = "block"; } } var timer = null; window.onresize = function(){ timer && clearTimeout(timer); setTimeout(function(){ hideDiv(); }, 200); } hideDiv();

登录后复制

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3092346.html

(0)
上一篇 2025年3月28日 13:55:07
下一篇 2025年3月28日 13:55:54

AD推荐 黄金广告位招租... 更多推荐

相关推荐

发表回复

登录后才能评论