滑动幻灯片插件-EASY SLIDER

使用步骤

1、引入以下的js和css文件

<link href="css/screen.css" rel="stylesheet" type="text/css" media="screen" /><script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easySlider1.7.js"></script>

2、在head标签中加入以下js代码

$("#slider").easySlider({auto: true, continuous: true
});

3、在body标签中加入以下格式的html代码

<div id="slider">
  <ul>
    <li><a href="http://www.jq22.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
    <li><a href="http://www.jq22.com/preview/7"><img src="images/02.jpg" alt="Css Template Preview" /></a></li>
    <li><a href="http://www.jq22.com/preview/25"><img src="images/03.jpg" alt="Css Template Preview" /></a></li>
    <li><a href="http://www.jq22.com/preview/26"><img src="images/04.jpg" alt="Css Template Preview" /></a></li>
    <li><a href="http://www.jq22.com/preview/27"><img src="images/05.jpg" alt="Css Template Preview" /></a></li>
  </ul>
</div>

参数配置

参数名 参数说明 参数取值 默认值
prevId “上一张”按钮的ID ID字符串 
prevText “上一张”按钮的文字 字符串
nextId “下一张”按钮的ID ID字符串
nextText “下一张”按钮的文字 字符串
controlsShow 是否显示控制条 true或false
controlsBefore 如果您想添加一些额外的标记来获得更多的控制按钮你可以通过使用这些参数 标记
controlsAfter 如果您想添加一些额外的标记来获得更多的控制按钮你可以通过使用这些参数 标记
controlsFade 如果设置为false,当幻灯片到达末尾的时候将会使按钮失效 true或false true
firstId “第一张”按钮的ID ID字符串 
firstText “第一张”按钮的文字 字符串 
firstShow 是否显示回到第一张按钮 true或false 
lastId “最后一张”按钮的ID ID字符串 
lastText “最后一张”按钮的文字 字符串 
lastShow 是否显示回到最后一张按钮 true或false 
vertical 是否垂直滚动 true或false false
speed 幻灯片播放毫秒速度 整数
auto 是否自动播放 true或false true
pause 如果将auto设为true，表示幻灯片切换间隔毫秒 整数
continuous 是否连续播放 ture或false
numeric 是否显示数字导航代替上一页/下一页导航 ture或false

numericId 数字导航的ID ID字符串

PREVIOUS:
NEXT:
强力推荐一款强大布局插件-FERROSLIDER
JQUERY图片弹出框插件-JQUERY LIGHTBOX