jquery - 页面缩放/内容重叠

Question

我有一个高度为 50px 的顶部 div，宽度必须是整个浏览器窗口的宽度。我正在设置 `width: 100%; 但问题是，当我放大放置在里面的其他内容时，会与其他内容重叠。我知道宽度：100%；将始终仅与当前缩放的屏幕一样多，这就是内容重叠的原因。

这个 div 的位置是固定的。我尝试使用 jQuery 设置宽度并且它可以工作，但是当缩小顶部 div 时不会保持最大可用屏幕宽度。

(document).ready(function(){
    var widthT = $(window).width();
    $('#top_status').css("width", widthT);
});

上面的 jQuery 可以放大，但不能缩小，因为宽度已经设置并且没有改变。

我正在尝试获得一些可以作为 facebook 顶部蓝条工作的东西。无论缩放如何，它都能很好地保持原位。

谢谢

score 1 · Accepted Answer

如果您发布 jsFiddle，我们可以提供具体示例，但您应该能够使用Media Queries解决这些问题。它们可以让您在调整窗口大小时控制断点，并确保无论查看站点的分辨率如何，它看起来都很好。

以下是导航中媒体查询的一些资源：

即使您不想更改结构或将其转换为下拉菜单，您也可以使用相同的媒体查询来调整菜单元素以使其适合任何位置。

1 回答 1