2010-10-11 55 views
1

我一直在尝试在JavaScript中创建自己的自定义滚动条实现。它必须模仿MS Office 2007的外观和行为我在那里检查了许多解决方案,但没有任何东西满足我的需求。我的主要问题是:如何计算滚动条高度和它自己拖动像素时移动目标页面的行数之间的平衡?换句话说,滚动条精度和可用空间之间的平衡可以上下拖动。有没有现成的算法来重用?我搜索了网络,但什么也没找到,对于什么是一个常见的编码问题,这很奇怪?滚动条算法

谢谢!

+0

也许你已经签出了,但是如果你不这样做:你看看jScrollPane了吗?它可能会改变样式(“主题”0和实现你想要的。[http:// www .kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html] – Nivas 2010-10-11 13:55:22

+0

@Nivas - 您的链接已过期http://jscrollpane.kelvinluck.com/ – 2010-10-11 14:08:42

+0

我发现了新的JScrollPane(http://jscrollpane.kelvinluck我们测试的所有浏览器都有不稳定的行为,试着点击演示页面上方或下方的滚动区域,有时候酒吧会移动,有时候会移动,有时候不会。 。 – 2010-10-11 14:08:49

回答

2

这是如何计算的滚动条

scrollbar.style.top = element.scrollTop/(element.scrollHeight/element.style.height) 

的顶部位置,你可以使用这个onscroll您的滚动元件。反之亦然,当你拖动你的滚动条时,这在另一个方向工作。

对于这个quick'n'dirty答案感到遗憾,如果您愿意,以后会提供更多信息。

+0

谢谢,但我没有问如何计算滚动条的顶部位置。如果您有任何想法,请提供更多详细信息。 – 2010-10-11 15:19:37

+0

您需要使用先前的算法来计算滚动条位置如果您使用鼠标滚轮进行滚动。因此,如果“scrollbar.style.top = element.scrollTop /(element.totalHeight/element.height) ”,则计算element.scrollTop的公式应为“element.scrollTop = element.totalHeight/element.height * scrollbar.style .top“ – koko 2010-10-11 20:56:56

+0

请解释一下element.scrollTop元素.totalHeight和element.height的意思。我一点都不明白你的意思。 – 2010-10-11 22:37:47