我有一些代码可以根据浏览器窗口的宽度隐藏div。它在浏览器窗口中很好用。当我尝试在Twitter iOS应用中打开同一页面时，该代码不再起作用。这是代码。
$(function () {
var isAdded = false;
$(window).resize(function () {
if ($(window).width() > 975) {
isAdded = true;
$('.sideBar').removeClass('hidden');
} else if ($(window).width() < 975) {
isAdded = false;
$('.sideBar').addClass('hidden');
}
});
});
如果我在第二个条件中添加
alert(screen.width);，则警报窗口不会显示在移动设备中。任何帮助表示赞赏更新
我接受了Sphinxxx的回复并尝试了此操作。它有效，但似乎有点草率。你们怎么想我对js / jquery有点绿色
$(function () {
var isAdded = false;
$(window).load(function () {
if ($(window).width() < 975) {
isAdded = false;
$('.sideBar').addClass('hidden');
};
$(window).resize(function () {
if ($(window).width() > 975) {
isAdded = true;
$('.sideBar').removeClass('hidden');
} else if ($(window).width() < 975) {
isAdded = false;
$('.sideBar').addClass('hidden');
}
});
});
});
最佳答案
您在meta中使用<head>吗？
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
UPD：
尝试用
.ready()函数替换包装函数：$(document).ready(function() {
var isAdded = false;
$(window).resize(function () {
if ($(window).width() > 975) {
isAdded = true;
$('.sideBar').removeClass('hidden');
} else if ($(window).width() < 975) {
isAdded = false;
$('.sideBar').addClass('hidden');
}
});
$(window).resize(); // don't forget to trigger a code
});
关于jquery - 根据窗口大小隐藏和显示div元素，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36109290/