代码之家 › 专栏 › 技术社区 › Crashy

在屏幕调整大小时删除jQuery函数

screen-size resize css jquery

Crashy · 技术社区 · 8 年前

我创建了一个jQuery函数来显示一个div,它应该在屏幕大小超过1000px时工作。

该函数工作正常,但当我调整屏幕大小时,它不工作,因为jQuery函数已经加载。因此,当我调整屏幕大小时,函数会保持不变。

如果我调整了屏幕的大小并且小于1000px,有没有办法删除这个脚本?

目前,当我打开网页,屏幕已经小于1000px,但当我调整屏幕大小时,脚本才起作用

这就是我现在拥有的。

jQuery(document).ready(function() {
    jQuery(window).resize(function() {
        if(jQuery(window).width() >= 1000) {

          jQuery("#mega-menu-projects").mouseover(
              function(){
                  jQuery("#mega-menu-projects").show();
              }
          );

          jQuery("#mega-menu-projects").mouseout(
              function(){
                  jQuery("#mega-menu-projects").hide();
              }
          );

        }
    }).resize();
});

3 回复 | 直到 8 年前

Louys Patrice Bessette 8 年前

您可以使用CSS来完成 @media

#mega-menu-projects{
  display:none;
}

@media screen and (min-width: 1000px) {
  #mega-menu-projects{
    display:block;
  }
}

Phiter 8 年前

你应该改变你的逻辑。您可以将事件侦听器保留在那里,但在检查屏幕大小是否不是您想要的大小后将其取消:

jQuery("#mega-menu-projects").mouseover(function(){
    if (jQuery(window).width() < 1000) return;
    jQuery("#mega-menu-projects").show();
});

jQuery("#mega-menu-projects").mouseout(function () {
    if (jQuery(window).width() < 1000) return;
    jQuery("#mega-menu-projects").hide();
});

BenJamin 8 年前

使用jQuery,可以使用 .off

如果屏幕比您需要的小,那么添加一个else子句来删除mouseover和mouseout事件就足够简单了。

类似(未经测试)

else {
    jQuery("#mega-menu-projects").off()
}

也就是说,如果您只想根据屏幕大小在悬停时添加/删除可视打开/关闭功能。在CSS中使用 media queries .

可以根据屏幕大小添加/删除悬停状态

@media (max-width: 1000px) {
    #mega-menu-projects:hover{
        ...
    }
}

推荐文章

zxcvbnm · 为什么字符串::resize和字符串::substr O(1)

3 年前

Heinz · 无法调整非模式html对话框设置style='resize:both'的大小,但可用于模式对话框

3 年前

Alex Cai · 未最大化后的AWT面板布局问题

3 年前

GoGoAllen · 如何针对所有类型的浏览器大小修复我的网页布局?

7 年前

Alberto Soto · 媒体查询加载时动态激活/禁用脚本并调整窗口大小

7 年前

Jojo Narte · 如何将UIView调整为特定的高度和宽度,包括其子视图?

7 年前

Tarzan · Python调整图像大小

7 年前

Eddy · 调整窗体大小时调整标签字体大小

8 年前

Nemo XXX · 如何在QTableView中按比例调整列宽?

8 年前

Brian Hamill · Numpy调整图像大小/重缩放图像

8 年前