注册    登录
最新消息: 本以为花钱买了那个amh的板面可以让网站更稳定,结果搞得整 个网站运行出错,真是赔了夫人又折兵,对不起大家了。最新版jquery-2.1.1下载  ,在线的 jquery API使用手册, 稳定版jquery.mobile-1.3.2下载

最好的响应式幻灯片插件FlexSlider2应用

jQuery插件 fishcity 1000浏览

FlexSlider2是一个轻量级的响应式jQuery内容滚动插件,压缩后只有21KB大小。它能让你轻松的创建内容滚动的效果,具有非常高的可定制性。它是将UL列表转换成内容滚动的列表,可以自动播放,或者使用导航按钮和键盘来控制,同时支持视频插放。下面来看下这个牛X的flexslider2的使用方法。

引入核心文件,这里的CSS可以自定义

<link rel="stylesheet" href="flexslider.css" type="text/css" media="screen" />
<script src="http://ajax. /ajax/libs/jquery/1/jquery.min.js"></script>
<script defer src="jquery.flexslider.js"></script>

写入HMTL

<div class="flexslider">
  <ul class="slides">
    <li>
      <img src="slide1.jpg" />
    </li>
    <li>
      <img src="slide2.jpg" />
    </li>
    <li>
      <img src="slide3.jpg" />
    </li>
    <li>
      <img src="slide4.jpg" />
    </li>
  </ul>
</div>

写入JS

$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide"
  });
});

本代码是默认值最简单基础的代码,更多的参数设置请参考实例或是官方文档

转载请注明:jQ酷 » 最好的响应式幻灯片插件FlexSlider2应用

下载地址:本站下载 | 百度云 | 官方下载
下载说明:
☉如果您发现本文件已经失效不能下载,请联系站长修正!
☉如果您下载的文件出现解压不了或文件受损等情况,请选择其他下载点重新下载。
☉下载本站资源,如果服务器暂不能下载请过一段时间重试!
☉有小部分资源需要解压密码,请输入:jqcool.net。
☉本站提供的所有资源仅供学习研究与参考,请勿用于商业用途。