如何在智能手机或移动浏览器中隐藏div

Ahm*_*bal 5 html javascript css jquery

如果有人从智能手机,手机等访问我想隐藏我的div我的javascript代码对我不起作用,请让我知道如何解决它?

<html>
<head>
<title>Test</title>
<script type="text/javascript">
    if (/Android|webOS|iPhone|iPad|iPod|pocket|psp|kindle|avantgo|blazer|midori|Tablet|Palm|maemo|plucker|phone|BlackBerry|symbian|IEMobile|mobile|ZuneWP7|Windows Phone|Opera Mini/i.test(navigator.userAgent)){
     document.getElementById('mybox').style.display = 'none';
     };
</script>
</head>
<body>

<div id="mybox">
Hello world
</div>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Jay*_*han 3

您需要使用媒体查询来创建响应式 UI, 对于不同的屏幕分辨率,您的所有 HTML 组件(可能是 Div/CSS 类等)
应该有不同的分辨率。 搜索一些好的响应式教程,您一定会发现 现在很有趣人们使用Twitter Bootstrap来使 UI 响应式,它有许多响应式类,这些类对于创建快速响应式 UI 开发更有用。样本CSS

@media screen and (max-width: 960px) {

}
Run Code Online (Sandbox Code Playgroud)