带Mootools的水平卷轴

时间:2010-08-19 13:22:49

标签: javascript mootools

我正在为自己的网站工作,我正在使用我从其他网站获得的Mootools自定义水平滚动条(并获得了他们的许可)。虽然我已经设法让滚动条按照我想要的方式运行,但我有两个问题需要修复,而且我自己也没有专门的知识。

我已经设置了一个简单的演示页here

您可以使用鼠标滚轮/触控板上下或左右滚动,您可以抓住滚动条并拖动它,您可以单击该行的任意位置直接跳转。所以所有的功能都没问题。我的问题是:

  1. 如果您滚动到中间(或除起始位置以外的任何位置),然后调整浏览器窗口的大小,即使内容保持不变,滚动条手柄也会跳回到开始/左侧。如果您再次开始滚动,内容将跳回以与滚动条手柄的位置对齐。理想情况下,当调整窗口大小时,句柄会保持不变,但我无法弄清楚如何自行完成此操作。

  2. 在页面的右侧/右侧,我想要一个后退按钮,可以顺利地滚动回到开始/“顶部”。我所管理的最好的就是你现在看到的内容,其中内容顺利滚动,而滚动条只是跳回到它的第一个位置。虽然我可以通过简单地直接跳回到开始来解决这个问题,但如果滚动条像内容一样平滑地向后滚动它肯定会更好。

  3. 非常感谢任何帮助!

1 个答案:

答案 0 :(得分:1)

您的第一个问题正在发生,因为每次窗口调整大小时都会调用positionIt()。查看该函数,您可以看到每次都在初始化bottomSlider。我会将positionIt()分解为初始化函数和定位函数,并确保在窗口调整大小时仅调用定位函数。

第二个问题可能是通过为bottomSlider创建一个单独的step()函数并在onChange中调用它而不是使用内联匿名函数来解决的。然后,您可以创建一个计时器或补间,调用step()将滚动条移回其原始位置(然后根据它移动视口。)

希望这有点道理!