Question

我正在使用两个jQuery插件来提供响应和分类的Feed。这些插件就像许多网格布局插件一样，它在查找窗口大小以定位所有网格元素后使用绝对位置。我的问题是我的网格元素有下拉选项，最初的高度为0px，并且点击它的高度例如为300px。因此，当下拉列表展开其父项下面的项目时，下拉作为高度为0时，它会加载带有下拉的网格物品，因为它已经在屏幕的该区域中设置了绝对位置，因此不会向下调整。当有一个窗口调整大小时，它会重新计算所有内容并重新组织网格。我需要找到一种方法来运行该函数，通过onclick事件调整所有内容的大小，以便所有内容都能正确重新排列。现在我只能点击元素两次而不是一次才能使它工作，你知道为什么会发生这种情况。

以下是我现在尝试触发调整大小的内容

function reply_dropdown_clicked() {
    $( ".replies_feed" ).animate( {"height" : "300px"} );
    window.dispatchEvent(new Event('resize'));
    console.log("resize");
}

$( ".meta__price ul li:nth-child(3)" ).click(function() {
    reply_dropdown_clicked();
});

以下是resze的事件监听器

// window resize / recalculate sizes for both flickity and isotope/masonry layouts
    window.addEventListener('resize', throttle(function(ev) {
        recalcFlickities()
        iso.layout();
    }, 50));

Answer 1

$(window).trigger('resize');会成为您想要的吗？

jQuery问题|需要两次点火才能正常工作

1 个答案: