在飞行JQuery调整大小

On the Fly JQuery Resize

本文关键字：调整 JQuery 飞行更新时间：2023-09-26

我正在使用一个响应式设计网站，更具体地说，是一个包含几个div的页面。当你重新调整网页的大小时，div的宽度会改变，因为它们被设置为百分比。因为高度必须保持不变，除非div消失，否则我必须设置断点来改变高度。如果我不改变高度，它保持不变，并在div之间添加"margin"。从本质上讲，我的逻辑是:当窗口重新调整大小并且宽度小于810px时，然后删除所有CSS样式，并添加边距顶部，项目2到无穷大。由于这很难通过写作来解释，我在最后添加了以下代码。

当我重新调整浏览器窗口的大小，并且内容div小于810px时，样式不会被删除。看看我的代码，什么是罪魁祸首?

函数在第27-50行:https://github.com/jdmagic21/coded_container/blob/master/work.js

你应该考虑使用CSS媒体查询来根据浏览器的宽度改变样式，而不是使用Javascript。

这是一个教程-谷歌上最热门的"如何使用CSS媒体查询"之一

这里是媒体查询的浏览器兼容性表。只要你不太关心IE8或之前的版本，你就可以了!

你可以这样做CSS媒体查询。

@media screen and (max-width: 810px) {
     /* reset the styles of the divs here */
}