javascript - 如何在移动设备上自动隐藏网页轮播？

Question

我有一个使用 bootstrap 3 构建的网页，页面顶部有一个轮播组件。我想隐藏完整 <div>在移动设备上打开页面时的部分。当屏幕分辨率(不是窗口大小)低于 800x600 时，我还想将它隐藏在电脑上。

这可以使用简单的 meta 来实现吗？标记还是我必须使用 javascript？

Answer 1

媒体查询是可能的。

让我们假设您有一个旋转木马，它被包裹在 ID 为“carouselContainer”的 div 中

现在在你的 CSS 中；

@media (max-width:800px) {
    #carouselContainer {
        display:none !important;
    }
}

显示太小会隐藏轮播。

要了解有关媒体查询的更多信息，read this link