调整浏览器窗口大小时禁用jquery插件

ve1jdramas

我正在使用一个简单的jquery插件在Bootstrap 3中实现悬停效果的下拉菜单。它在桌面以及移动设备上均能完美运行(还原为原始的bootstrap下拉行为),但是当用户调整桌面上的浏览器窗口大小时,悬停功能仍然有效。我尝试在768px的导航栏崩溃后一起禁用所有功能。

我正在使用以下插件:https : //github.com/CWSpear/bootstrap-hover-dropdown

我最终使用以下解决方案:

$(function () {
  if ($(window).width() > 768) {
    $('.dropdown-toggle').dropdownHover();
  }
});

但是我无法使其完美运行,现在,如果您以768px刷新页面或降低页面,则插件不会触发(鼠标单击时下拉菜单起作用),但是如果您从任何较大的页面开始缩小,它将继续触发。如果有人可以帮忙,我就差一点了。

亚历克斯里顿

您的函数只能在dom准备就绪时运行一次:http : //learn.jquery.com/using-jquery-core/document-ready/

最简单的解决方案是在调整窗口大小后检查这种情况

$(function () {
  var $window = $(window),
      $toggle = $('.dropdown-toggle'),
      isActive = false;

  function onResize() {
      if (!isActive && $window.width() > 768) {
        $toggle.dropdownHover();
        isActive = true;
      } else {
        // stop the dropdown
        isActive = false;
      }
  }

  $window.resize(onResize);
  // call once on start up
  onResize();
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

调整浏览器/窗口大小时,Div的JQuery / Javascript自动调整大小

来自分类Dev

在调整浏览器大小时禁用滚动事件

来自分类Dev

调整浏览器窗口大小时,li元素重叠

来自分类Dev

调整浏览器窗口大小时,标题部分消失

来自分类Dev

调整浏览器窗口大小时,如何正确调整textarea的大小?

来自分类Dev

浏览器窗口调整大小时如何在CSS中调整梯形大小

来自分类Dev

调整浏览器窗口大小并截图

来自分类Dev

浏览器插件可调整窗口大小以进行浏览测试

来自分类Dev

调整浏览器窗口大小时,垂直/水平滚动条不会出现

来自分类Dev

调整Web浏览器窗口大小时的DIV定位问题

来自分类Dev

调整浏览器窗口大小时如何防止div元素下降?

来自分类Dev

HTML / CSS:调整浏览器窗口大小时如何使网页保持原状?

来自分类Dev

调整浏览器窗口大小时,垂直/水平滚动条不会出现

来自分类Dev

在浏览器窗口调整大小时切换滑出可见性

来自分类Dev

调整Web浏览器窗口大小时的DIV定位问题

来自分类Dev

调整浏览器窗口大小时,图像顶部的HTML按钮不会保持固定

来自分类Dev

CSS样式-调整浏览器窗口大小时,元素会移到中心

来自分类Dev

调整浏览器窗口大小时的动态下拉宽度以及背景图片

来自分类Dev

调整浏览器窗口大小时如何阻止 Div 移动

来自分类Dev

调整浏览器窗口大小时 Div 容器正在移动

来自分类Dev

每当调整浏览器窗口屏幕大小时,让我的函数重新执行

来自分类Dev

调整浏览器窗口大小时,块元素变大并且不会垂直居中

来自分类Dev

调整浏览器大小时CSS容器未调整

来自分类Dev

调整浏览器大小时css容器未调整

来自分类Dev

调整浏览点大小时刷新一次浏览器-JQuery

来自分类Dev

jQuery在调整大小时仅根据浏览器宽度更新变量

来自分类Dev

调整浏览器大小时,简单的jQuery移动菜单停止工作

来自分类Dev

调整浏览器大小时对齐Flexbox部分

来自分类Dev

调整浏览器大小时CSS边框影响宽度

Related 相关文章

  1. 1

    调整浏览器/窗口大小时,Div的JQuery / Javascript自动调整大小

  2. 2

    在调整浏览器大小时禁用滚动事件

  3. 3

    调整浏览器窗口大小时,li元素重叠

  4. 4

    调整浏览器窗口大小时,标题部分消失

  5. 5

    调整浏览器窗口大小时,如何正确调整textarea的大小?

  6. 6

    浏览器窗口调整大小时如何在CSS中调整梯形大小

  7. 7

    调整浏览器窗口大小并截图

  8. 8

    浏览器插件可调整窗口大小以进行浏览测试

  9. 9

    调整浏览器窗口大小时,垂直/水平滚动条不会出现

  10. 10

    调整Web浏览器窗口大小时的DIV定位问题

  11. 11

    调整浏览器窗口大小时如何防止div元素下降?

  12. 12

    HTML / CSS:调整浏览器窗口大小时如何使网页保持原状?

  13. 13

    调整浏览器窗口大小时,垂直/水平滚动条不会出现

  14. 14

    在浏览器窗口调整大小时切换滑出可见性

  15. 15

    调整Web浏览器窗口大小时的DIV定位问题

  16. 16

    调整浏览器窗口大小时,图像顶部的HTML按钮不会保持固定

  17. 17

    CSS样式-调整浏览器窗口大小时,元素会移到中心

  18. 18

    调整浏览器窗口大小时的动态下拉宽度以及背景图片

  19. 19

    调整浏览器窗口大小时如何阻止 Div 移动

  20. 20

    调整浏览器窗口大小时 Div 容器正在移动

  21. 21

    每当调整浏览器窗口屏幕大小时,让我的函数重新执行

  22. 22

    调整浏览器窗口大小时,块元素变大并且不会垂直居中

  23. 23

    调整浏览器大小时CSS容器未调整

  24. 24

    调整浏览器大小时css容器未调整

  25. 25

    调整浏览点大小时刷新一次浏览器-JQuery

  26. 26

    jQuery在调整大小时仅根据浏览器宽度更新变量

  27. 27

    调整浏览器大小时,简单的jQuery移动菜单停止工作

  28. 28

    调整浏览器大小时对齐Flexbox部分

  29. 29

    调整浏览器大小时CSS边框影响宽度

热门标签

归档