全屏滚动特效
jQuery Scrollify
www:http://projects.lukehaas.me/scrollify/#home
github:https://github.com/lukehaas/Scrollify
基本设置
Scrollify需要的jQuery1.6+。
大多数基本设置如下:
<! doctype html> <html> <head> <script> $(function() { $.scrollify({ section : "section", }); }); </script> </head> <body> <section></section> <section></section> </body> </html>
默认配置:
$.scrollify({ section : "section", sectionName : "section-name", easing: "easeOutExpo", scrollSpeed: 1100, offset : 0, scrollbars: true, before:function() {}, after:function() {}, afterResize:function() {} });
选项
- section:选择的部分。
- sectionName:您可以定义每个部分的哈希值。这使得有可能以永久链接到特定的部分。这被设定为在各节的数据属性。数据属性的名称被定义sectionName定义。
- easing:定义缓动方法。
- offset:偏移的距离以像素为单位,以抵消由每个部分的位置。
- scrollbars:滚动条一个布尔值来定义滚动条是否可见或不可见。
- before:被称为前部分是通过移动方式滚动到一个回调。参数包括部分和全部部分元素的数组的索引。
- after:在那之后被调用后一个新的部分滚动到一个回调。参数包括部分和全部部分元素的数组的索引。
- afterResize:被称为窗口大小调整后的回调。
方法
$.scrollify.move("#name"); $.scrollify.instantMove("#name"); $.scrollify.next() $.scrollify.previous() $.scrollify.instantNext() $.scrollify.instantPrevious() $.scrollify.destroy() $.scrollify.update() $.scrollify.current() $.scrollify.disable() $.scrollify.enable() $.scrollify.isDisabled()
发表评论