我有一个响应式网页，针对不同的屏幕尺寸具有不同的设计，我正在使用 @mediaquery 来更改我的设计。我想让用户能够更改更小或更大屏幕尺寸的设计，即使屏幕尺寸没有改变。
是否可以在不改变屏幕尺寸的情况下用js触发@mediaquery？
看一下查询.js http://wicky.nillia.ms/enquire.js/，一个轻量级的纯 JavaScript 库，用于响应 CSS 媒体查询。
有了它，您可以添加一个class to body基于屏幕的宽度。然后，如果您根据主体是否具有某个类来组织 CSS。您可以使用 JS 根据用户的选择动态地将这些类添加到主体中。
你可以使用另一个 JS 库做同样的事情：媒体课 https://github.com/jonathantneal/MediaClass，下面这行JS：
MediaClass("small-screen", "body(this-max-width: 480px)");
添加类small-screen到 body 标签，如果body的宽度低于480px。现在，您可以向网站添加一些按钮，这些按钮会更改主体的宽度，并且如果您以这种方式设置 CSS 类，则页面的布局将会更改，而不是“仅”基于屏幕尺寸。因此，对于这两种方法，您都必须稍微重构一下 CSS。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
