查看文章 |
百度新闻上面图片轮换代码
2009-08-08 14:42
注意到百度新闻上面图片轮换代码,毕竟是div时代,使用的就是精简代码了 直接复制下面代码就可以运行了,也是在这个网站爬下来滴! <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script type="text/javascript" src="http://news.baidu.com/resource/js/bdscrollingimg_bak.js"></script> </head> <style> /*--scrolling image--*/ .scrollingimg{width:228px; background:#EBEBEB; position:relative;} .imgview{clear:both; width:228px; height:162px;} .imgnav{width:65px; height:20px; position:absolute; bottom:25px; right:0; text-align:center; overflow:hidden;} .imgtitle{ height:24px; overflow:hidden; text-align:left; padding:0 3px;} .imgview a{text-decoration:none; font-size:0;} .imgview img{width:226px; height:160px;} .imgnav a.navbtn{display:block; font:bold 12px/20px normal; float:right; width:20px; height:20px; text-decoration:none; color:#000; cursor:pointer; filter:alpha(opacity=50); opacity:0.5;} .imgnav a.navbtn:link, .imgnav a.navbtn:visited{background:#000; color:#fff;} .imgnav a.navbtn:hover{background:#ff0; color:#000;} .imgnav a.navbtn:active{background:#bbb; color:#000;} .imgnav a.curbtn:link, .imgnav a.curbtn:visited{background:#EBEBEB; color:#000; font-weight:bold;} .imgtitle a{font:bold 14px/24px normal; } .imgtitle a:link, .imgtitle a:visited{color:#000; text-decoration:none;} .imgtitle a:hover{text-decoration:underline;} </style> <body> <div class="scrollingimg" id="scrollingImg"> <div class="imgview" id="imgView"> <a href="" target="_blank"> <img src="" class="firstimg" alt=""> </a> </div> <div class="imgnav" id="imgNav"> <a class="navbtn" index="3" mon="ct=1&a=9&pn=3&col=4" href="javascript:void(0)">3</a> <a class="navbtn" index="2" mon="ct=1&a=9&pn=2&col=4" href="javascript:void(0)">2</a> <a class="navbtn" index="1" mon="ct=1&a=9&pn=1&col=4" href="javascript:void(0)">1</a> </div> <div class="imgtitle" id="imgTitle"> <a href="" target="_blank"></a> </div> <div style="clear:both;"></div> </div> <script type="text/javascript" language="javascript"> <!-- var imgList = []; imgList.push({ 'title':'俄出售4架战机 每架仅5美元', 'url':'http://intl.ce.cn/qqss/200908/08/t20090808_19736996.shtml', 'imgUrl':'http://news.baidu.com/z/resource/r/image/2009-08-08/6ec683bc6a59be81806eea69c3350e79.jpg' }); imgList.push({ 'title':'亿万富豪为父祝寿请上万宾客', 'url':'http://focus.scol.com.cn/zgsz/20090808/20098835724.htm', 'imgUrl':'http://news.baidu.com/z/resource/r/image/2009-08-08/6389c3ded7a41116d2dfa35b118b3100.jpg' }); imgList.push({ 'title':'11矽肺民工维权 等待中5人离世', 'url':'http://news.xinmin.cn/rollnews/2009/08/08/2351299.html', 'imgUrl':'http://news.baidu.com/z/resource/r/image/2009-08-08/621eb7f9704b6c59573e76fbe86a70fb.jpg' }); var navObj = new BdScrollImage.Navigator( document.getElementById('imgNav'), true), imgView = new BdScrollImage.View( document.getElementById('imgView'), imgList), titleObj = new BdScrollImage.Title( document.getElementById('imgTitle'), imgList), bdIL = new BdScrollImage.ImageList(imgList), bdSC = new BdScrollImage.Controller(5000); bdSC.addObserver(navObj); navObj.addObserver(imgView); navObj.addObserver(titleObj); navObj.addObserver(bdSC); imgView.addObserver(bdSC); titleObj.addObserver(bdSC); navObj.registerEvent(); imgView.registerEvent(); titleObj.registerEvent(); bdSC.registerEvent(); navObj.setCurrent(1); bdIL.init(); //--> </script> </body> </html> |
最近读者: