弹性字体jQuery渐变焦点图.zip资源-CSDN文库

共9个文件

jpg：6个

html：1个

js：1个

版权申诉

html5

jQuery

javascript

118 浏览量 2022-11-25 10:22:34 上传评论收藏 454KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

弹性字体jQuery渐变焦点图.zip （9个子文件）

弹性字体jQuery渐变焦点图

弹性字体jQuery渐变焦点图.jpg 101KB

jiaoben1590

images

01.jpg 77KB

05.jpg 78KB

04.jpg 58KB

li_cor.gif 178B

03.jpg 81KB

02.jpg 62KB

index.html 4KB

zzsc.js 2KB

<!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> </head> <body> <style type="text/css"> *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";} /* picshow */ .picshow{position:relative;z-index:1;height:240px;width:930px;overflow:hidden;margin:60px auto 0 auto;} .picshow .picwrap li{position:absolute;left:0px;top:0px;width:930px;height:240px;} .picshow .picwrap li.hide{display:none;} .picshow .picwrap li img{width:930px;height:240px;} .picshow .butt{position:absolute;left:0px;bottom:0px;width:100%;height:40px;text-align:center;} .picshow .butt .trans_bg{width:100%;height:100%;background:#000;opacity:0.5;filter:alpha(opacity=50);} .picshow .butt ul{position:absolute;left:30px;top:0px;text-align:center;zoom:100%;} .picshow .butt li{position:relative;float:left;display:inline;width:120px;height:34px;margin:3px 26px 0px 26px;padding-top:2px;text-align:center;opacity:0.5;filter:alpha(opacity=50);} .picshow .butt li img.menu{width:116px;height:30px;cursor:pointer;} .picshow .butt li img.bg{position:absolute;left:0px;top:0px;cursor:pointer;} .picshow .butt li.on{opacity:1;filter:alpha(opacity=100);} .picshow .pic_titles{position:absolute;bottom:40px;left:0px;width:100%;} .picshow .pic_titles ul{margin-left:30px;} .picshow .pic_titles li{float:left;display:inline;width:172px;height:22px;overflow:hidden;text-align:center;} .picshow .pic_titles li p{display:none;width:100%;height:22px;overflow:hidden;line-height:22px;text-align:center;color:#fff;font-size:14px;font-weight:bold;} </style> <div class="picshow"> <div class="picwrap"> <ul> <li><a href="http://www.moobnn.com/"><img src="images/01.jpg" width="930" height="240" alt="网页模板" /></a></li> <li class="hide"><a href="http://www.moobnn.com/"><img src="images/02.jpg" width="930" height="240" alt="网页模板" /></a></li> <li class="hide"><a href="http://www.moobnn.com/"><img src="images/03.jpg" width="930" height="240" alt="网页模板" /></a></li> <li class="hide"><a href="http://www.moobnn.com/"><img src="images/04.jpg" width="930" height="240" alt="网页模板" /></a></li> <li class="hide"><a href="http://www.moobnn.com/"><img src="images/05.jpg" width="930" height="240" alt="网页模板" /></a></li> </ul> </div> <div class="pic_titles"> <ul> <li><p>网页模板</p></li> <li><p>网页模板</p></li> <li><p>网页模板</p></li> <li><p>网页模板</p></li> <li><p>网页模板</p></li> </ul> </div> <div class="butt buttons"> <div class="trans_bg"></div> <ul> <li class="on"><img class="menu" src="" alt="网页模板" /><img class="bg" src="images/li_cor.gif" alt="网页模板" /></li> <li><img class="menu" src="" alt="网页模板" /><img class="bg" src="images/li_cor.gif" alt="网页模板" /></li> <li><img class="menu" src="" alt="网页模板" /><img class="bg" src="images/li_cor.gif" alt="网页模板" /></li> <li><img class="menu" src="" alt="网页模板" /><img class="bg" src="images/li_cor.gif" alt="网页模板" /></li> <li><img class="menu" src="" alt="网页模板" /><img class="bg" src="images/li_cor.gif" alt="网页模板" /></li> </ul> </div> </div> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script> <script type="text/javascript" src="js/zzsc.js"></script> <div style="text-align:center;clear:both"><br> <p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p><br> <p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉