演示网站 jQuery导航栏
编写代码
<!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 href="css/zzsc.css" type="text/css" rel="stylesheet" /> <script src="js/jquery.js" type="text/javascript"></script> <script src="js/zzsc.js" type="text/javascript"></script> </head> <body> <div id="zzsc"> <a class="pre"></a> <div id="wai_box"> <div class="zzsc_box"> <ul> <li><a href="#" class="images"><img src="images/1.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/2.jpg" /></a><span class="title">优酷视频</span></li> <li><a href="#" class="images"><img src="images/3.jpg" /></a><span class="title">1号店面</span></li> <li><a href="#" class="images"><img src="images/4.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/5.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/6.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/7.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/8.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/9.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/10.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/11.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/12.jpg" /></a><span class="title">演示图片信息</span></li> </ul> <ul> <li><a href="#" class="images"><img src="images/5.jpg" /></a><span class="title">土豆网</span></li> <li><a href="#" class="images"><img src="images/6.jpg" /></a><span class="title">迅雷看看</span></li> <li><a href="#" class="images"><img src="images/7.jpg" /></a><span class="title">龍将</span></li> <li><a href="#" class="images"><img src="images/8.jpg" /></a><span class="title">pps</span></li> <li><a href="#" class="images"><img src="images/9.jpg" /></a><span class="title">秦美人</span></li> <li><a href="#" class="images"><img src="images/10.jpg" /></a><span class="title">秦美人</span></li> <li><a href="#" class="images"><img src="images/11.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/12.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/12.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/13.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/14.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/15.jpg" /></a><span class="title">演示图片信息</span></li> </ul> <ul> <li><a href="#" class="images"><img src="images/11.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/12.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/13.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/14.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/15.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/16.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/17.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/18.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/19.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/20.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/1.jpg" /></a><span class="title">演示图片信息</span></li> <li><a href="#" class="images"><img src="images/4.jpg" /></a><span class="title">演示图片信息</span></li> </ul> </div> </div> <a class="next"></a> <div class="nav"> <a class="now"></a> <a ></a> <a ></a> </div> </div> </body> </html>
注册免费下载
抱歉，隐藏内容须成功 评论本文 后刷新可见！
