skippr演示7种不同的幻灯片效果

收藏

skippr是一个轻快的基于jQuery的幻灯片插件，兼容主流浏览器，并且有常用的api。

0、请不要问“在不在”之类的问题，有问题直接问！1、学生或暂时没有工作的童鞋，整站资源免费下载！2、￥9.9充值终身VIP会员,加我微信，826096331 拉你进VIP群学习！3、程序员加油,技术改变世界。在线 充值

查看演示

加我微信，拉你进VIP群学习：

下载资源 下载积分： 30 积分

skippr 优势：

• 支持左右滑动、淡入淡出两种切换方式
• 支持左右箭头导航
• 支持键盘方向键控制
• 支持自动播放
• 支持响应式
• 支持日志

HTML

<div id="container">
    <div id="skippr">
        <div style="background-image: url(img/img1.jpg)"></div>
        <div style="background-image: url(img/img2.jpg)"></div>
        <div style="background-image: url(img/img3.jpg)"></div>
        <div style="background-image: url(img/img4.jpg)"></div>
        <div style="background-image: url(img/img5.jpg)"></div>
    </div>
</div>

引入jQuery和skippr插件

<link rel="stylesheet" href="css/jquery.skippr.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery.skippr.min.js"></script>

jQuery

$(function(){
    $('#skippr').skippr();
});

skippr演示

1、默认 2、遮罩高度 3、HTML data属性 4、动画时间 5、字体颜色 6、背景颜色 7、反向 8、文字排版 9、禁用链接

skippr相关API