我正在使用 jquery 删除 div,以使我的主屏幕在小屏幕上看起来有所不同,并且它在 Macbook Air 和 Iphone X 上运行良好。但是在 Android 上,div 并未按预期删除和替换。这是网站草稿的地址:
http://projetocc.learningtodom.com/
这是 jquery 位的代码:
<script>
$(function(){
if (window.matchMedia("(max-width: 750px)").matches) {
$('.desktop').remove();
}
});
$(function(){
if (window.matchMedia("(min-width: 750px)").matches) {
$('.mobiles').remove();
}
});
</script>
如果您还需要我发布一些 css 代码,请告诉我。
最佳答案
如果您的 JavaScript 方法没有取得任何成功,也许您可以考虑使用 CSS 和媒体查询。您可能会发现它更容易并且给出更一致的结果。
只需在文档的头部添加一个视口(viewport)元标记
<head>
...
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...
</head>
然后在 CSS 中添加以下内容
@media(max-width:750px){
.desktop{
display:none;
}
}
@media(min-width:751px){
.mobiles{
display:none;
}
}
我对您的一个断点做了一个小小的更改。使用您发布的代码,移动设备和桌面 div 都将隐藏在 750 像素处。
希望这会有所帮助!
关于javascript - 网站在 Galaxy S5 浏览器上没有响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59242139/