Bootstrap:响应式设计 - 当窗口从980px调整为979px时执行JS

Question

我正在使用Twitter的Bootstrap.当我的窗口宽度低于980px时,我想执行某个JS函数(显示工具提示一次)(如你所知,在此大小的Bootstrap上修改Navbar并隐藏标准菜单项) - 窗口从768到979,为简短.我知道

@media (min-width: 768px) and (max-width: 979px) {...}

此选项可用于捕获事件.但是,它可能仅用于更改现有样式

body {background-color:#ccc;}

我需要启动JS函数,或者添加或删除元素的特定样式.我试过了:

<script>
  window.onresize = function () {
      if (window.outerWidth == 980) {alert('');}
  };
</script>

但是这个解决方案太慢了,甚至挂起了浏览器窗口.那么,当窗口从GREATER端调整为979px并执行JS函数时,是否有任何解决方案来捕获此事件？

谢谢大家!

Answer 1

outerWidth是一种让你失踪的方法():

if (window.outerWidth() == 980)

在任何情况下,如果您使用jQuery:

$(window).resize(function() {
  if ($(this).width() < 981) {
    //do something
  }
});