<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>六屏右侧带缩略图的jQuery轮播幻灯片代码</title>
<link type="text/css" href="css/style.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/sucaihuo.js"></script>
</head>
<body style="padding-top:10px;">
<div id="zSlider">
<div id="picshow">
<div id="picshow_img">
<ul>
<li><a href="#"><img src="images/a1.png"></a></li>
<li><a href="#"><img src="images/a2.png"></a></li>
<li><a href="#"><img src="images/a3.png"></a></li>
<li><a href="#"><img src="images/a4.png"></a></li>
<li><a href="#"><img src="images/a5.png"></a></li>
<li><a href="#"><img src="images/a6.png"></a></li>
</ul>
</div>
<div id="picshow_tx">
<ul>
<li>
<h3><a href="#">垂直轮播插件标题信息内容1</a></h3>
<p>上海第一家死飞精品店，由三个外国人与一中国人联合创办，主要经营客订个性单速车，帮助他们得到自己梦想中的车架。</p>
</li>
<li>
<h3><a href="#">垂直轮播插件标题信息内容2</a></h3>
<p>冰岛有“火山岛”、“雾岛”、“冰封的土地”、“冰与火之岛”之称。有想过在这里骑游吗？下面看看Ovegur的冰岛骑游之旅吧。</p>
</li>
<li>
<h3><a href="#">垂直轮播插件标题信息内容3</a></h3>
<p>这几天，全国各地的空气糟糕透顶！北京空气污染指数又爆表了！！！经过资深车友的推荐及亲身体验，整理出几款超强防毒的骑行口罩。</p>
</li>
<li>
<h3><a href="#">垂直轮播插件标题信息内容4</a></h3>
<p>近年来户外骑行等运动录像盛行，Gopro这品牌可说功不可没，新版的Gopro Hero3具有1200万像素带Wi-Fi功能……</p>
</li>
<li>
<h3><a href="#">垂直轮播插件标题信息内容5</a></h3>
<p>“我要从南骑到北，我还要从白骑到黑。我要人们都看到我，却不知道我是谁。爱上我你就不要后悔，总有一天我要远走高飞。”</p>
</li>
<li>
<h3><a href="#">垂直轮播插件标题信息内容6</a></h3>
<p>外出骑行，不会总有一个修车老大爷在你扎胎后的不远处等着你，本期课堂教会你如何撬胎补胎，再碰上爆胎，你就可以淡定了。</p>
</li>
</ul>
</div>
</div>
<div id="select_btn">
<ul>
<li><a href="#"><img src="images/a1.png"><span class="select_text">垂直轮播插件标题信息内容1</span><span class="select_date">2019/01/16</span></a></li>
<li><a href="#"><img src="images/a2.png"><span class="select_text">垂直轮播插件标题信息内容2</span><span class="select_date">2019/01/15</span></a></li>
<li><a href="#"><img src="images/a3.png"><span class="select_text">垂直轮播插件标题信息内容3</span><span class="select_date">2019/01/13</span></a></li>
<li><a href="#"><img src="images/a4.png"><span class="select_text">垂直轮播插件标题信息内容4</span><span class="select_date">2019/01/08</span></a></li>
<li><a href="#"><img src="images/a5.png"><span class="select_text">垂直轮播插件标题信息内容5</span><span class="select_date">2019/12/28</span></a></li>
<li><a href="#"><img src="images/a6.png"><span class="select_text">垂直轮播插件标题信息内容6</span><span class="select_date">2019/12/26</span></a></li>
</ul>
</div>
</div>
</body>
</html>
jQuery带缩略图焦点图片轮播特效.zip
版权申诉
145 浏览量
2023-09-25
13:43:08
上传
评论
收藏 117KB ZIP 举报
jQuery带缩略图焦点图片轮播特效.zip （11个子文件） 
js 
sucaihuo.js 2KB jquery.min.js 94KB css style.css 2KB
index.html 4KB images 
a3.png 12KB a6.png 12KB a5.png 15KB a2.png 17KB a1.png 13KB a4.png 15KB picshow_bg.png 125B资源评论
