如何在调整窗口大小时隐藏Facebook聊天框？

Question

我试图在Jquery中重现，当视区大小改变时，Facebook如何隐藏或显示打开的聊天框。基本上，如果你打开了6个聊天窗口，如果你调整或缩小浏览器的大小，如果这6个窗口在视觉上不能固定屏幕大小，一些聊天窗口就会隐藏起来。

我使用$( window ).resize()函数来检测所有打开的窗口的总宽度加上一些边距是否大于窗口的宽度，然后隐藏第一个聊天窗口，如果有空间容纳更多窗口，则显示最后一个。基本的弹出或推送到堆栈...

我的方法不起作用，因为每当运行resize时，我的脚本总是试图隐藏或显示窗口……(参见下面的代码)

如有任何建议，欢迎光临。

ChatWidget.isEnoughRoom = function() {

return ($(window).width() > ((ChatWidget.WINDOW_WIDTH * $('.chatWindowWidget:visible').length) + ChatWidget.CONTACTLIST_WIDTH + 100));

};

$(window).resize(function(){

    if(!ChatWidget.isEnoughRoom()) {
            $('.chatWindow:visible:last').hide() ;
    } else {
        $('.chatWindow:hidden:last').show() ;
    }

})

Answer 1

你的问题似乎与每次调整窗口大小时多次触发调整大小函数有关。我在chrome上测试了一下，它触发了两次。试试这个：https://github.com/louisremi/jquery-smartresize