Question

我想根据屏幕大小添加/删除一个类。当我将屏幕尺寸设置为小于700px时，会添加该类，但是当我将屏幕大小调整为700以上时，它会保持添加类而不是删除它。

jQuery(document).ready(function($){
$(window).resize(function() {
  if ($(this).width() < 700) {
  $('.home #secondaryHeader').addClass('fixed');
  } else {
  $('.home #secondaryHeader').removeClass('fixed'); 
  }
});
});

Answer 1

未删除类的原因是因为您需要添加逻辑来删除类：

＆＃13;

if ($(this).width() < 700) {
  $('.home #secondaryHeader').addClass('fixed');
  $('#featured header img, #primaryNav').remove();
} else {
  $('.home #secondaryHeader').removeClass('fixed');
}

＆＃13;

另一方面，如果您尝试进行样式设计，更好的解决方案是简单地使用CSS媒体查询来处理重新调整大小和不同的屏幕尺寸。

如何使jQuery .resize（）不止一次触发？

1 个答案: