经典的jQuery图片广告轮番切换特效
jQuery经典的图片广告轮番切换特效，带缩略图，淡入淡出过渡，调用简单方便，可以修改为动态数据库版，使用了jquery插件，由于缩略图只能布局指定张数的图片，因此本图片切换的图片数量是有限制的。
前台部分代码
代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>广告 </title>
<link href="css/css.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1[1].2.1.pack.js" type="text/javascript"></script>
<script src="js/slide.js" type="text/javascript"></script>
</head>
<body>
<br/><br/>
<!--大图轮换区-->
<DIV id=topstory>
<DIV id=highlight>
<DIV id=featured>
<!--标签开始 -->
<DIV class=image id=image_xixi-01>
<A title=08广告创意风暴（十） href="http://www.jscss8.com/" target=_blank>
<IMG alt=08广告创意风暴（十） src="images/47492_253130.jpg">
</A>
<DIV class=word>
<H3>08广告创意风暴（十）</H3>
<P>视觉中国网站编辑收集整理08年最新的广告创意，以连载的形式的呈现的大家的</P>
</DIV>
</DIV>
<!--标签结束 -->
<DIV class=image id=image_xixi-02><A class=open title=13家经典“大牌”的logo进化
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=13家经典“大牌”的logo进化 src="images/47426_252416.jpg">
</A>
<DIV class=word>
<H3>13家经典“大牌”的logo进化</H3>
<P>看看这些颇有影响力的品牌早期使用的logo，是不是嗅到时代的气息了呢？</P></DIV></DIV>
<DIV class=image id=image_xixi-03><A class=open
title="视觉专访：悉尼奥运会首席设计顾问Michael Bryce"
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt="视觉专访：悉尼奥运会首席设计顾问Michael Bryce"
src="images/47526_253407.jpg"> </A>
<DIV class=word>
<H3>视觉专访：悉尼奥运会首席设计顾问Michael Bryce</H3>
<P>Michael Bryce是全球著名的澳大利亚设计师，他在从建筑设计</P></DIV></DIV>
<DIV class=image id=image_xixi-04><A class=open title=adidas“没有不可能”(四)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(四) src="images/47469_252798.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(四)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-05><A class=open title=adidas“没有不可能”(三)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(三) src="images/47468_252784.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(三)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-06><A class=open title=adidas“没有不可能”(二)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(二) src="images/47464_252767.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(二)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-07><A class=open title="iphone ipod该换衫了？定制壁纸给你换！"
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt="iphone ipod该换衫了？定制壁纸给你换！"
src="images/47457_252699.jpg"> </A>
<DIV class=word>
<H3>iphone ipod该换衫了？定制壁纸给你换！</H3>
<P>当我们拥有了ipod或者iphone，也必须享用那些自带壁纸和桌面主题么</P></DIV></DIV></DIV>
<DIV id=thumbs>
<UL>
<LI class="first btnPrev"><IMG id=play_prev
src="images/btn_prev.gif"> </LI>
<LI class=slideshowItem><A id=thumb_xixi-01
href="#image_xixi-01"><IMG height=20
src="images/e8bbb9f5e00523d5528615a835201266_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-02
href="#image_xixi-02"><IMG height=20
src="images/7bb09aff47d9393658b0385f2aabf5a5_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-03
href="#image_xixi-03"><IMG height=20
src="images/3e85fb19e8c09f630f68a9b5120fa264_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-04
href="#image_xixi-04"><IMG height=20
src="images/4d39c524100fd0385e7c9de82efd8e33_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-05
href="#image_xixi-05"><IMG height=20
src="images/354a2840f556bfeaf96c84a00cbe09ac_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-06
href="#image_xixi-06"><IMG height=20
src="images/c00d230fbc41140319a1ff901fdbe9c4_1_48_20.jpg"
width=48> </A></LI>
<LI class="last_img slideshowItem"><A id=thumb_xixi-07
href="#image_xixi-07"><IMG height=20
src="images/55f1457fa8f165d95fa3ee8f5eb4422a_1_48_20.jpg"
width=48> </A></LI>
<LI class="last btnNext"><IMG id=play_next
src="images/btn_next.gif">
<DIV class=clear></DIV></LI></UL></DIV>
<SCRIPT type=text/javascript>
var target = ["xixi-01","xixi-02","xixi-03","xixi-04","xixi-05","xixi-06","xixi-07"];
</SCRIPT>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>广告 </title>
<link href="css/css.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1[1].2.1.pack.js" type="text/javascript"></script>
<script src="js/slide.js" type="text/javascript"></script>
</head>
<body>
<br/><br/>
<!--大图轮换区-->
<DIV id=topstory>
<DIV id=highlight>
<DIV id=featured>
<!--标签开始 -->
<DIV class=image id=image_xixi-01>
<A title=08广告创意风暴（十） href="http://www.jscss8.com/" target=_blank>
<IMG alt=08广告创意风暴（十） src="images/47492_253130.jpg">
</A>
<DIV class=word>
<H3>08广告创意风暴（十）</H3>
<P>视觉中国网站编辑收集整理08年最新的广告创意，以连载的形式的呈现的大家的</P>
</DIV>
</DIV>
<!--标签结束 -->
<DIV class=image id=image_xixi-02><A class=open title=13家经典“大牌”的logo进化
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=13家经典“大牌”的logo进化 src="images/47426_252416.jpg">
</A>
<DIV class=word>
<H3>13家经典“大牌”的logo进化</H3>
<P>看看这些颇有影响力的品牌早期使用的logo，是不是嗅到时代的气息了呢？</P></DIV></DIV>
<DIV class=image id=image_xixi-03><A class=open
title="视觉专访：悉尼奥运会首席设计顾问Michael Bryce"
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt="视觉专访：悉尼奥运会首席设计顾问Michael Bryce"
src="images/47526_253407.jpg"> </A>
<DIV class=word>
<H3>视觉专访：悉尼奥运会首席设计顾问Michael Bryce</H3>
<P>Michael Bryce是全球著名的澳大利亚设计师，他在从建筑设计</P></DIV></DIV>
<DIV class=image id=image_xixi-04><A class=open title=adidas“没有不可能”(四)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(四) src="images/47469_252798.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(四)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-05><A class=open title=adidas“没有不可能”(三)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(三) src="images/47468_252784.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(三)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-06><A class=open title=adidas“没有不可能”(二)
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt=adidas“没有不可能”(二) src="images/47464_252767.jpg">
</A>
<DIV class=word>
<H3>adidas“没有不可能”(二)</H3>
<P>运动是一种游戏，一种积极的释放，更是一种生活态度。在运动中解放自己的心灵</P></DIV></DIV>
<DIV class=image id=image_xixi-07><A class=open title="iphone ipod该换衫了？定制壁纸给你换！"
href="http://www.jscss8.com/" target=_blank><IMG
class=full alt="iphone ipod该换衫了？定制壁纸给你换！"
src="images/47457_252699.jpg"> </A>
<DIV class=word>
<H3>iphone ipod该换衫了？定制壁纸给你换！</H3>
<P>当我们拥有了ipod或者iphone，也必须享用那些自带壁纸和桌面主题么</P></DIV></DIV></DIV>
<DIV id=thumbs>
<UL>
<LI class="first btnPrev"><IMG id=play_prev
src="images/btn_prev.gif"> </LI>
<LI class=slideshowItem><A id=thumb_xixi-01
href="#image_xixi-01"><IMG height=20
src="images/e8bbb9f5e00523d5528615a835201266_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-02
href="#image_xixi-02"><IMG height=20
src="images/7bb09aff47d9393658b0385f2aabf5a5_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-03
href="#image_xixi-03"><IMG height=20
src="images/3e85fb19e8c09f630f68a9b5120fa264_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-04
href="#image_xixi-04"><IMG height=20
src="images/4d39c524100fd0385e7c9de82efd8e33_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-05
href="#image_xixi-05"><IMG height=20
src="images/354a2840f556bfeaf96c84a00cbe09ac_1_48_20.jpg"
width=48> </A></LI>
<LI class=slideshowItem><A id=thumb_xixi-06
href="#image_xixi-06"><IMG height=20
src="images/c00d230fbc41140319a1ff901fdbe9c4_1_48_20.jpg"
width=48> </A></LI>
<LI class="last_img slideshowItem"><A id=thumb_xixi-07
href="#image_xixi-07"><IMG height=20
src="images/55f1457fa8f165d95fa3ee8f5eb4422a_1_48_20.jpg"
width=48> </A></LI>
<LI class="last btnNext"><IMG id=play_next
src="images/btn_next.gif">
<DIV class=clear></DIV></LI></UL></DIV>
<SCRIPT type=text/javascript>
var target = ["xixi-01","xixi-02","xixi-03","xixi-04","xixi-05","xixi-06","xixi-07"];
</SCRIPT>
</body>
</html>
