超简洁的响应式幻灯 - unslider

妖狐艹你老母 2022-03-20 08:48 166阅读 0赞

日期：2013-3-22  来源：[GBin1.com][]

[![响应式幻灯][title.jpg]][title.jpg 1]

[**在线演示**  
][Link 1]

**[Unslider][]**是一款超迷你的响应式幻灯，如果你需要找到一款纯粹的幻灯插件的话。unslider就是你的不错选择，支持响应式，并且支持触摸设备。没有多余的功能，纯粹的幻灯实现。主要特性：

*  支持不同浏览器
 *  支持键盘导航支持
 *  自动修改图片高度
 *  支持响应式
 *  如果需要支持触摸设备的话，可以使用[jQuery.event.swipe][]插件

## 如何使用？ ##

导入类库：

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 ul { list-style: none; }

Javascript：

$(function() {
        $('.banner').unslider();
    });

其它相关的jQuery幻灯：

[超棒的响应式幻灯jQuery插件- refineslide ][jQuery_- refineslide]

[超灵活的jQuery幻灯插件: Really Simple Slideshow ][jQuery_ Really Simple Slideshow]

via [ 极客社区][Link 2]

来源：[超简洁的响应式幻灯 - unslider][GBin1.com]

[GBin1.com]: http://www.gbin1.com/technology/jquerynews/20130322-jquery-plugin-unslider/
[title.jpg]: http://www.gbin1.com/technology/jquerynews/20130322-jquery-plugin-unslider/title.jpg
[title.jpg 1]: http://www.gbin1.com/technology/jquerynews/20130322-jquery-plugin-unslider/index.html
[Link 1]: http://www.gbtags.com/gb/demoviewer/576/7b65fa0b-5a01-43a7-88a6-b4865f520f9c/index.html.htm
[Unslider]: http://unslider.com/
[jQuery.event.swipe]: http://stephband.info/jquery.event.swipe/
[jQuery_- refineslide]: http://www.gbin1.com/technology/jquerynews/20120702refineslide/
[jQuery_ Really Simple Slideshow]: http://www.gbin1.com/technology/jquerynews/20120901-jquery-plugin-simple-slidershow/
[Link 2]: http://www.gbtags.com/gb/share/576.htm