Unslider 是一款非常轻量的 jQuery 插件（压缩后只有 1KB），能够用于任何 HTML 内容的滑动。可以响应容器的大小变化，自动排布不用大小的滑块。可以通过整合 jQuery.event.swipe 来让其支持触屏设备的滑动功能。
您可能感兴趣的相关文章
使用方法：
引入 jQuery 和 Unslider：
<script src="//code.jquery.com/jquery-latest.min.js"></script> <script src="//unslider.com/unslider.js"></script>
编写 HTML 无序列表：
<div class="banner">
<ul>
<li>This is a slide.</li>
<li>This is another slide.</li>
<li>This is a final slide.</li>
</ul>
</div>
使用 CSS 美化外观：
.banner { position: relative; overflow: auto; }
.banner li { list-style: none; }
.banner ul li { float: left; }
最后就是调用插件：
$('.banner').unslider({
speed: 500, // 滚动速度
delay: 3000, // 动画延迟
complete: function() {}, // 动画完成的回调函数
keys: true, // 启动键盘导航
dots: true, // 显示点导航
fluid: false // 支持响应式设计
});
您可能感兴趣的相关文章
- 期待已久的2012年度最佳 jQuery 插件揭晓
- 精心挑选的优秀jQuery Ajax分页插件和教程
- 推荐几款非常棒的 jQuery 全景图片展示插件
- 12款经典的白富美型 jQuery 图片轮播插件
- 精心挑选优秀的 JavaScript 日历和时间插件
本文链接：Unslider – 轻量的响应式 jQuery 内容滑块插件
编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
作者：山边小溪
主站：yyyweb.com 记住啦：）
欢迎任何形式的转载，但请务必注明出处。
