jQuery更改媒体查询宽度值

Question

在页面运行的同时，是否可以使用 jQuery 或其他方式更改 @media query 的 css 宽度值？

例如，如果在 style.css 文件中有以下内容：

@media screen and (min-width: 400px) {
   /*whatever*/
}

在网站加载后将其更改为500px。

- Adam Pietrasiak

---

抱歉离题了，但为什么？ - z1m.in

我也有同样的需求。 - Dipak

我知道这是一个旧的帖子，但是为了回应@jQuery00，如果添加或删除了更多内容，我需要能够在不同的设备上调整最小宽度。 - Fuzz

这对我也很有帮助。如果发生调整大小或旋转事件，我需要扩展一个iframe。我可以用JavaScript编写所有内容，但更改@media查询中的一个参数会更简单、更清洁、更优雅。 - Tony Brasunas

除了@TonyBrasunas所说的，图形密集型CSS是在GPU上渲染的，因此比JS具有更好的性能。 - ierdna

Answer 1

传统方法无法实现此功能。您需要通过jQuery插入完整的CSS。例如：

 $('body').append("<style type='text/css'>@media screen and (min-width: 500px) { /*whatever*/ }</style>");

- Rajiv007