【插件】旅游网站带缩略图幻灯代码
2016-01-31阅读：2501
演示效果：
使用说明：
1、安装插件：
点击下载插件
下载附件解压并上传到/Skin/目录下面
2、修改/Skin/toupicflash/CSS.css：
（1）修改图片宽高：替换770（宽）、275（高）
（2）调整左右箭头的位置：
（3）调整显示文字的位置：
（4）调整4张图片的总体宽度：（单张图片宽度×4+11）px
3、调用代码：
<link rel='stylesheet' href='/Skin/tourpicflash/CSS.css' />
<script type="text/javascript" src="/Skin/tourpicflash/1141.js"></script>
<script type="text/javascript" src="/Skin/tourpicflash/zzsc.js"></script>
<div id="bd" class="gclearfix">
<div class="slide" id="Slide">
<div class="slide-hd">
<h2 class="title">
<%
set rs=server.CreateObject("adodb.recordset")
sql="select top 4 Item1,Item2,Item3 from Cuz_Flash where "&ItemRecT&" order by Seq,ItemID desc"
rs.open sql,conn,1,1
tourpicflashi=1
do while not rs.eof
%>
<a href="<%=rs("Item3")%>"<%if tourpicflashi<>1 then%> style="display:none"<%end if%>><%=rs("Item1")%></a>
<%
tourpicflashi=tourpicflashi+1
rs.movenext
loop
%>
</h2>
<div class="thumb" id="slidePagination">
<ul class="gclearfix">
<%
rs.movefirst
tourpicflashi=1
do while not rs.eof
%>
<li<%if tourpicflashi=1 then%> class="selected"<%end if%>><a ><img src="<%=rs("Item2")%>" alt="<%=rs("Item1")%>" /><span class="mask"></span></a></li>
<%
tourpicflashi=tourpicflashi+1
rs.movenext
loop
%>
</ul>
</div>
<div class="slide-hd-bg"></div>
</div>
<div class="slide-bd" id="slideWrapper">
<div class="pic-list">
<%
rs.movefirst
tourpicflashi=1
do while not rs.eof
%>
<a href="<%=rs("Item3")%>" class="J-pic-node"><img src="<%=rs("Item2")%>" lazysrc="<%=rs("Item2")%>" alt="<%=rs("Item1")%>" /></a>
<%
tourpicflashi=tourpicflashi+1
rs.movenext
loop
rs.close
set rs=nothing
%>
</div>
</div>
<div class="slide-btn">
<a href="" class="prev">上一页
<!--[if IE 6]>
<div>
<span class="arrow"></span>
<span class="mask"></span>
</div>
<![endif]-->
</a>
<a href="" class="next">下一页
<!--[if IE 6]>
<div>
<span class="arrow"></span>
<span class="mask"></span>
</div>
<![endif]-->
</a>
</div>
</div>
</div>
