纯爪哇岛描述语言移动优先的幻灯片效果

简要教程沸腾是一款移动优先的纯爪哇岛描述语言幻灯片插件。这个幻灯片插件仅4k大小，它的原理仅是为超文本标记语言元素添加和移除适当的班级来显示和隐藏它们，至于这些班级样式你可以完全自定义。特点有：移动优先动画和过渡效果都使用半铸钢钢性铸铁(铸造半钢)来生成轻量级，仅4k大小高度灵活性和可扩展性可自定义事件和应用程序接口没有任何外部依赖

使用方法使用该幻灯片插件首先需要引入wallop.css和Wallop.min.js文件。

链接rel='样式表href=' path/to/wallop。CSS ' script src=' http : path/to/wallop。量滴js '/脚本HTML结构

该幻灯片的基本超文本标记语言结构如下，你可以为第一个幻灯片幻灯片添加。冲击力-物品-当前等级。

div class=' Wallop ' div class=' Wallop-list ' div class=' Wallop-item '……/div class=' Wallop-item '……/div class=' Wallop-item '……/div class=' Wallop-item '……/div class=' Wallop-item '……/div button class=' Wallop-button previous ' previous/button class=' Wallop-button next ' next/button/div初始化插件

脚本var wall pel=文档。queryselector(' .瓦隆；var滑块=新瓦隆(瓦洛佩尔)；/script添加动画效果

该幻灯片插件默认是没有动画过渡效果的，如果你需要添加动画效果，需要引入相应的wallop-animation.css文件，并为元素添加沃洛普- xxxx级。例如要添加淡入淡出的效果：

head link rel='样式表href='路径/到/wallop . CSS“link rel=”样式表href='路径/到/Wallop-fade。CSS/head div class=' Walop-fade './div可用动画类型

该幻灯片可用的过渡动画类型有：瓦力-滑动瓦力-淡化瓦力-刻度瓦力-旋转瓦力-折叠瓦力-垂直-幻灯片上面是一些内置的过渡动画类型，你也可以自定义自己的过渡动画。配置参数下面是一些可用的配置参数：按钮上一个类：“Wallop-button previous”按钮下一个类：“Wallop-button next”项目类：“Wallop-item”当前项目类：“Wallop-item-current”显示上一个类：“Wallop-item-show previous”显示下一个类：“Wallop-item-show next”隐藏上一个类：“Wallop”方法冲击力幻灯片插件提供了一些基本的方法用于按钮的控制：goTo

允许跳转到指定指数的幻灯片上。

var滑块=文档。queryselector(' .瓦隆；定义变量瓦隆=新瓦隆（滑块);//跳转到第二个幻灯片（索引从0开始)冲击力。GoTo(1)；然后

跳转到下一个幻灯片幻灯片。

var滑块=文档。queryselector(' .瓦隆；定义变量瓦隆=新瓦隆（滑块);//跳转到下一个滑动冲击力。next()；以前的

跳转到前一个幻灯片幻灯片。

var滑块=文档。queryselector(' .瓦隆；定义变量瓦隆=新瓦隆（滑块);//跳转到前一个滑动冲击力。previous()；事件冲击力在每一次幻灯片改变的时候都会发出一个事件，它返回一个详述对象，该对象包含当前幻灯片的指数和冲击力对象。

var滑块=文档。queryselector(' .瓦隆；定义变量瓦隆=新瓦隆（滑块);Wallop.on('change '，function(event){//event。细节。wall pel/=div class=' Wallop '……/div//event。细节。currentitemindex/=number })；以上就是为大家分享的纯爪哇岛描述语言移动优先的幻灯片效果制作过程，希望可以帮助大家制作更精美的幻灯片效果。