jquery - 调试 jQuery 动画

Question

我正在使用一个名为“bookblock”的翻页插件(演示可以在 here 找到)。

我已经在每个页面上放置了图像，并且动态添加这些图像。问题是当我翻页时，前一个和下一个 div 突然在书的每一侧被压在一起。以下屏幕截图是在翻页动画中截取的。

正如您所看到的，书中的每一页都是“item1”、“item2”等。所有显示属性都设置为“none”，但由于某种原因它们可以被看到。

可以找到此网站的实时版本 here 。我尝试过添加

$(".bb-item").hide();

就在动画序列之前，它似乎从 js/jquery.bookblock.js 的第 259 行开始，但运气不佳。我还能如何调试这个问题？

更新:非常抱歉，我应该提到您可以通过单击实时版本中每个 div 右下角的“展开”图标来访问翻页书。

Answer 1

我不确定为什么会这样，但是face的有用评论帮助我发现调整窗口大小实际上可以解决问题。

更新书中的项目后，我立即触发调整大小方法:

$(window).resize();

看来问题已经解决了，谢谢!

看来 bookblock js 文件使用了名为 debouncedresize 的东西，它似乎将监听器附加到窗口调整大小事件。我怀疑这可能是相关的，但目前，我没有对此行为的正确解释。