jquery - 如果屏幕分辨率小于 x 附加 css

Question

如果屏幕分辨率小于 960 像素，则尝试修改元素的 css

我的代码不起作用，在萤火虫中没有看到任何错误。

<script type="text/javascript">
jQuery(window).resize(function() {
  if (jQuery(window).width() < 960) {
    jQuery(".snow").css('display', 'none');
  }
});
</script>

Answer 1

@media您可以使用命令完全使用 CSS 完成此操作。

@media (max-width:960px) { css... } //nothing with screen size bigger than 960px

@media (min-width:960px) { css... } //nothing with screen size smaller than 960px

看这里

Jason Whitted 提出了一个很好的观点，这只是 CSS 3，因此它不适用于旧版浏览器（但它应该适用于所有现代浏览器）。有关兼容性，请参见此处。您的主要问题将是 IE 8 及以下版本。

编辑 - 设备选择

@media screen { .nomobile { display: block; } } //desktops/laptops

@media handheld { .nomobile { display: none; } } //mobile devices

或者您可以假设移动设备的宽度会更小，然后继续。