MooTools教程(15):滚动条(Slider)

Slider的选项

Snap：（默认为false），可以是一个true或者false值。这决定了滑块是不是以最小单元格移动

Offset：（默认是0），这是滑块相对于开始的位置。你可以对此做一个试验。

Range：（默认是false），这是一个非常有用的选项。你可以设置一个数字范围，会依照此数字和你的步数（step）触发onchange事件。例如：如果你设置的范围是[0, 200]，而且你设置的step值为10，那么每次onchange的step的值将是20。这个范围也是是负数，例如[-10,0]，这个数字在做反向的滚动条时会非常有用（下面有示例）。

Wheel：（默认是false），如果设置这个参数为true，这个滚动条将会识别鼠标滚轮事件。当使用鼠标滚轮时，你肯恩需要调整range参数，以保证鼠标滚轮事件的行为不是相反的（同样，后面会有例子）。

Steps：（默认是100），默认值为100非常有用，因为它可以很容易地作为百分比使用。当然，你也可以以你的理由设置任意多步（这是可以的）。

Mode：（默认是“horizontal”），这个参数定义了滚动条是水平滚动还是垂直滚动。当然了，要从水平滚动转化为垂直滚动还需要一些其它步骤。

回调事件

onChange：当step改变时，触发这个事件。同时传递参数“step”。可以从下面的例子中看到它是什么时候触发的。

onTick：当控制点的位置发生改变时触发这个事件。同时传递参数“position”。可以从下面的例子中看到它是什么时候触发的。

onComplete：当控制点释放时触发这个事件。捅死传递参数“step”。可以从下面的例子中看到它是什么时候触发的。

代码示例

让我们建立一个示例，以便看看它们的效果。

.set();方法：看一看按钮上的事件，看是怎么使用.set()方法的。它使用起来非常简单：调用slider对象，附加.set，然后是你想要滚动的步数（step）。

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!