百度空间 | 百度首页 
 
查看文章
 
百度新闻上面图片轮换代码
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>

类别:Web | 添加到搜藏 | 浏览() | 评论 (1)
 
最近读者:
 
网友评论:
1
2009-08-27 11:24 | 回复


谢谢
 
发表评论:
姓 名:
网址或邮箱: (选填)
内 容:
验证码: 请点击后输入四位验证码,字母不区分大小写
      

     

©2009 Baidu