JavaScript Reference
描述 (Description)
Foundation为轨道提供JavaScript组件，如下所示。
初始化 (Initializing)
要使用orbit插件， foundation.core.js ， foundation.orbit.js文件应包含在JavaScript中。 此插件需要以下实用程序库 -
foundation.util.keyboard.js
foundation.util.motion.js
foundation.util.timerAndImageLoader.js
foundation.util.touch.js
Foundation.Orbit
它用于创建轨道旋转木马的新实例。
var elem = new Foundation.Orbit(element);
| Sr.No. | 名称和描述 | 类型 |
|---|---|---|
| 1 | element 它是一个jQuery对象，可以成为一个旋转木马。 | jQuery |
| 2 | options 它会覆盖插件的默认设置。 | Object |
插件选项 (Plugin Options)
您可以使用它们来自定义轨道的实例。 它可以设置为单独的数据属性，一个合并的data-options属性或作为传递给插件构造函数的对象。 下表列出了Foundation中使用的插件选项。
| Sr.No. | 名称和描述 | 例 |
|---|---|---|
| 1 | bullets 它告诉JS加载项目符号。 | true |
| 2 | navButtons 它告诉JS将事件监听器添加到导航按钮。 | true |
| 3 | animInFromRight 要应用的motion-ui动画类。 | 'slide-in-right' |
| 4 | animOutToRight 要应用的motion-ui动画类。 | 'slide-out-right' |
| 5 | animInFromLeft 要应用的motion-ui动画类。 | 'slide-in-left' |
| 6 | animOutToLeft 要应用的motion-ui动画类。 | 'slide-out-left' |
| 7 | autoPlay 它会自动允许轨道在页面加载时设置动画。 | true |
| 8 | timerDelay 它表示将用于幻灯片转换的ms时间。 | 5000 |
| 9 | infiniteWrap 它通过幻灯片无限循环 | true |
| 10 | swipe 它允许轨道幻灯片绑定移动的滑动事件。 | true |
| 11 | pauseOnHover 它允许计时功能在悬停动画时暂停动画。 | true |
| 12 | accessible 它将键盘事件绑定到滑块。 | true |
| 13 | containerClass 类应用于轨道的容器。 | 'orbit-container' |
| 14 | slideClass 类适用于轨道的各个幻灯片。 | 'orbit-slide' |
| 15 | boxOfBullets 类应用于子弹的容器。 | 'orbit-bullets' |
| 16 | nextClass 类应用于下一个按钮。 | 'orbit-next' |
| 17 | prevClass 类应用于上一个按钮 | 'orbit-previous' |
| 18 | useMUI 它设置Boolean来标记JS以使用或不使用运动ui类。 对于向后兼容性，默认为true。 | true |
事件 (Events)
这些事件将从附加插件的任何元素触发。 幻灯片完成动画后，将触发slidechange.zf.orbit 。
功能 (Functions)
.geoSync设置一个timer对象并启动下一张幻灯片的计数器。
.changeSlide
它将幻灯片更改为新幻灯片。 它会触发Orbit#event事件以进行幻灯片更改。 下表列出了将被触发的事件。
| Sr.No. | 名称和描述 | 类型 |
|---|---|---|
| 1 | isLTR 当幻灯片必须从左向右移动时，它会标记。 | Boolean |
| 2 | chosenSlide 当选择一个时，下一个显示幻灯片的jQuery元素。 | jQuery |
| 3 | idx 当选择一个时，它代表其集合中的新幻灯片索引。 | Number |
.destroy会破坏旋转木马并隐藏元素。
