<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery箭头左右切换图文列表特效 - 站长素材</title>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div class="bodyCon08"><!--列表-->
<div class="students">
<div id="four_flash">
<div class="flashBg">
<ul class="mobile">
<li>
<img src="images/senke_xy00.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
<li>
<img src="images/senke_xy01.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
<li>
<img src="images/senke_xy02.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
<li>
<img src="images/senke_xy03.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
<li>
<img src="images/senke_xy04.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
<li>
<img src="images/senke_xy05.jpg" />
<dd>标题标题标题标题标题</dd>
<p>摘要摘要摘要摘要摘要摘要摘要摘要摘要摘要</p>
<a href=""></a>
</li>
</ul>
</div>
<div class="but_left"><img src="images/qianxleft.png" /></div>
<div class="but_right"><img src="images/qianxr.png" /></div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
//学员
var _index5=0;
$("#four_flash .but_right img").click(function(){
_index5++;
var len=$(".flashBg ul.mobile li").length;
if(_index5+5>len){
$("#four_flash .flashBg ul.mobile").stop().append($("ul.mobile").html());
}
$("#four_flash .flashBg ul.mobile").stop().animate({left:-_index5*326},1000);
});
$("#four_flash .but_left img").click(function(){
if(_index5==0){
$("ul.mobile").prepend($("ul.mobile").html());
$("ul.mobile").css("left","-1380px");
_index5=6
}
_index5--;
$("#four_flash .flashBg ul.mobile").stop().animate({left:-_index5*326},1000);
});
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：Chrome、FireFox、360、搜狗、Opera、傲游. 不支持Windows版Safari、IE8及以下浏览器。</p>
<p>更多源码：<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>
jQuery箭头左右切换图文列表特效.zip （13个子文件） 
jiaoben8347 js 
jquery.js 71KB css style.css 2KB
index.html 3KB images 
qianxr.png 2KB
senke_xy02.jpg 21KB senke_xy05.jpg 21KB senke_xy04.jpg 80KB qianxleft.png 2KB senke_xy00.jpg 64KB senke_xy01.jpg 80KB senke_xy03.jpg 64KB qianxleft1.png 2KB qianxr1.png 2KB资源评论
