javascript - 使用 smoothdivscroll 修复多行负载

Question

我目前正在将 smoothdivscroll 与混合媒体可变宽度类结合使用 - 它实际上并未设置为这样做(它喜欢所有类都是固定宽度的，但添加了空白代码似乎大部分工作正常。

我遇到的问题是，当页面加载内容时，它将 div 垂直放置在彼此之上，然后在加载所有内容时正确显示它们。示例见下:

http://www.betweenmanandbeast.com/bmb_om

我知道这不是插件应该做的 - 但它几乎可以正常工作(如果每个人都在 100mb 线路上那就没问题了!)，我觉得它只需要在某处添加一些额外的代码.

这是代码的 jsfiddle:

http://jsfiddle.net/wnD3r

另外值得一提的是，当它是一个自动宽度的帖子时(例如，如果您单击“博客”)，它在加载时全部停留在一行上，这意味着它使用一个自动宽度类正确计算，只是不是当页面上有多个时。初始化代码为:

$("#content").smoothDivScroll({
    mousewheelScrolling: "allDirections",
    manualContinuousScrolling: true,
    autoScrollingMode: "onStart",
    hiddenOnStart: false
    });

有什么想法吗？

非常感谢!

Answer 1

我不是 100% 确定我理解这个问题，但是 Smooth Div Scroll 需要知道滚动条中每个元素的宽度才能设置可滚动区域的总宽度。它通过迭代滚动条内的所有元素，将每个元素的宽度添加到所有元素的组合宽度来实现这一点。

如果您始终在标记中设置固定的元素宽度(在 CSS 中指定，甚至作为 HTML 标签的属性，就像您可以对图像所做的那样)，Smooth Div Scroll 计算总宽度不会有问题加载滚动条实际内容之前的所有元素。这意味着我可以在 jQuery 事件 $(document).ready 中设置可滚动区域的总宽度。

但问题是许多用户没有为他们的内容设置宽度，有时他们不能指定宽度，因为内容是动态的或通过某种方式通过 AJAX 加载，所以元素的宽度是未知的预先。因此，Smooth Div Scroll 会等待内容加载完毕(发生在 $(window).load 上)，然后再尝试计算可滚动区域内所有元素的总宽度。

以上就是关于 Smooth Div Scroll 如何加载内容的背景知识。如果您认为其中有任何事情可以更有效地或以不同的方式完成，我很乐意听到它，因为宽度计算是我收到的很多问题。