软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > 源码下载 > 脚本资源 > jQuery > Flexslider左右按钮的jQuery图片切换插件 v2.1下载

Flexslider左右按钮的jQuery图片切换插件 v2.1

  • 资源语言:简体中文
  • 资源类型:国外软件
  • 资源大小:463 KB
  • 资源等级:3星级
  • 相关链接:Home Page
  • 资源性质:免费版
运行环境:Windows
更新时间:2013-01-16 15:00:42
有无插件:无插件,请您放心使用!

Flexslider左右按钮的jQuery图片切换插件

Flexslider左右按钮的jQuery图片切换插件

使用步骤
1、引入以下的js和css文件

<!-- Place somewhere in the <head> of your document -->
<link rel="stylesheet" href="http://www.sd131.com/flexslider.css" type="text/css" />
<script src="http://www.xxx.com/jquery.min.js"></script>
<script src="http://www.xxx.com/jquery.flexslider.js"></script>
2、在head标签中加入以下js代码

<script type="text/javascript" charset="utf-8">
$(window).load(function() {

//simple FlexSlider call
$('.flexslider').flexslider();

// more complex call
$('.flexslider').flexslider({
animation: "slide",
controlsContainer: ".flex-container",
start: function(slider) {
$('.total-slides').text(slider.count);
},
after: function(slider) {
$('.current-slide').text(slider.currentSlide);
}
});
});
</script>
3、在body标签中加入以下格式的html代码

<div class="flexslider">
<ul class="slides">
<li>
<img src="http://www.xxx.com/slide1.jpg" />
<p class="flex-caption">Caption, legend...</p>
</li>
<li>
<img src="http://www.xxx.com/slide2.jpg" />
<p class="flex-caption">Caption, legend...</p>
</li>
<li>
<img src="http://www.xxx.com/slide3.jpg" />
</li>
</ul>
</div>

参数解析
所有参数请参见:http://www.myjqueryplugins.com/jquery-plugin/flexslider

 报告下载错误
点击链接开始下载
本类最新
相关教程
下载说明
栏目导航
推荐软件