Is there any way with jQuery or JavaScript to trigger a function when the user ends to resize the browser window?

换句话说:

  1. Can I detect mouse up event when user is resizing the browser window? Otherwise:
  2. Can I detect when a window resize operation is finished?

目前,我只能在用户开始使用jQuery调整窗口大小时触发事件

推荐答案

You can use .resize() to get every time the width/height actually changes, like this:

$(window).resize(function() {
  //resize just happened, pixels changed
});

You can view a working demo here, it takes the new height/width values and updates them in the page for you to see. Remember the event doesn't really start or end, it just "happens" when a resize occurs...there's nothing to say another one won't happen.


Edit: By comments it seems you want something like a "on-end" event, the solution you found does this, with a few exceptions (you can't distinguish between a mouse-up and a pause in a cross-browser way, the same for an end vs a pause). You can create that event though, to make it a bit cleaner, like this:

$(window).resize(function() {
    if(this.resizeTO) clearTimeout(this.resizeTO);
    this.resizeTO = setTimeout(function() {
        $(this).trigger('resizeEnd');
    }, 500);
});

您可以在某个地方拥有一个基本文件,无论您想做什么……然后您可以绑定到您正在触发的新resizeEnd事件,如下所示:

$(window).bind('resizeEnd', function() {
    //do something, window hasn't changed size in 500ms
});

You can see a working demo of this approach here

Jquery相关问答推荐

如何限制select2中的字符?

$ 不是函数 - jQuery 错误

在 JSON 对象上使用 jQuery 的 find()

为什么我的 toFixed() 函数不起作用?

何时执行 $(document).ready 回调?

如何在 jQuery Select 器中定义 css :hover 状态?

如何使用jquery取消绑定所有事件

当有多个具有相同 ID 值的元素时,jQuery 是如何工作的?

如何使用 jQuery 获取 div 的当前类?

如何在 JQuery UI 自动完成中使用 source:function()... 和 AJAX

如何更改 dropzone.js 中的默认文本?

jQuery Button.click() 事件被触发两次

jQuery:如何从 $.ajax.error 方法中获取 HTTP 状态代码?

使用 jQuery 和 CSS 将数字转换为星级显示

检测页面是否已完成加载

在 jquery 中使用 AJAX Post 从强类型 MVC3 视图传递模型的正确方法

如何以编程方式触发 ngClick

默认情况下如何将tinymce粘贴为纯文本

fancybox2 / fancybox 导致页面跳转到顶部

bootstrap 日期和时间 Select 器