特效描述:仿跑跑卡丁车 焦点图轮播。jQuery仿跑跑卡丁车焦点图轮播特效代码下载
代码结构
1. 引入CSS
<link rel="stylesheet" type="text/css" href="css/style.css">
2. 引入JS
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/scrollTo.js"></script> <script type="text/javascript" src="js/script.js"></script>
3. HTML代码
<div class="mainSlider"> <ul class="spotlight"> <li style="display:list-item;"><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> <li><a href="https://www.51qianduan.com/">51前端</a></li> </ul> <ul class="spotlightBanner"> <li class="selected"> <dl> <dt><img src="images/karblt0214dt01.jpg"></dt> <dd>情人节情书半价</dd> <dd>快和心爱的人表白</dd> </dl> </li> <li> <dl> <dt><img src="images/karbln0214dt02.jpg"></dt> <dd>暗+黑色爱情钥匙</dd> <dd>粉红蛇HT表爱意</dd> </dl> </li> <li> <dl> <dt><img src="images/karsay0214dt03.jpg"></dt> <dd>皮蛋和黑妞</dd> <dd>不可说的秘密2</dd> </dl> </li> <li> <dl> <dt><img src="images/karthr0207dt01.jpg"></dt> <dd>黄色幸运手套</dd> <dd>三倍幸运买一赠一</dd> </dl> </li> <li> <dl> <dt><img src="images/karlzs0207dt02.jpg"></dt> <dd>新春活动不停歇</dd> <dd>毒蛇徽章来相迎</dd> </dl> </li> <li> <dl> <dt><img src="images/kartho0207dt03.jpg" /></dt> <dd>超凡尊享礼包</dd> <dd>无限制控的春天</dd> </dl> </li> <li> <dl> <dt><img src="images/karlojdt08.jpg"></dt> <dd>罗技购物送惊喜</dd> <dd>跑跑好礼等你赢</dd> </dl> </li> </ul> <div class="scrollbar"> <div class="arrowButton"> <a href="javascript:" class="arrowUp"></a> <a href="javascript:" class="arrowDown"></a> </div> </div> </div>