<html>
<head>
<script type="text/javascript" >
var BdScrollImage={};BdScrollImage.Navigator=function(c,b){this.domObj=c;this.observers=[];this.curIndex=0;this.curBtn=null;var e=c.getElementsByTagName("a");this.btnObjs=[];if(b){for(var d=0,a=e.length;d<a;d++){this.btnObjs.push(e[a-1-d])}}else{for(var d=0,a=e.length;d<a;d++){this.btnObjs.push(e[d])}}};BdScrollImage.Navigator.prototype.registerEvent=function(){var a=this;(function(){function b(f){f=f||window.event;var d=f.target||f.srcElement,c=1;if(d.tagName&&d.tagName.toUpperCase()=="A"){c=d.getAttribute("index");if(c!=a.curIndex){a.notify({type:"STOP"});a.curBtn.className="navbtn";d.className="navbtn curbtn";a.curIndex=c;a.curBtn=d;a.notify({type:"SCROLL",param:a.curIndex});a.notify({type:"START"})}}}if(window.attachEvent){a.domObj.attachEvent("onclick",b)}else{a.domObj.addEventListener("click",b,false)}})()};BdScrollImage.Navigator.prototype.setCurrent=function(a){if(this.curBtn){this.curBtn.className="navbtn"}this.curIndex=a;this.curBtn=this.btnObjs[a-1];this.curBtn.className="navbtn curbtn";this.notify({type:"SCROLL",param:a})};BdScrollImage.Navigator.prototype.handleMessage=function(e){var d=e.type;switch(d){case"SCROLL":var a=this.btnObjs.length,c=this.curIndex,b=c%a+1;this.setCurrent(b);break;default:break}};BdScrollImage.Controller=function(a){this.timer=0;this.interval=a||5000;this.scrollFuncName=Math.random();this.observers=[];var b=this;window[this.scrollFuncName]=function(){b.notify({type:"SCROLL"})}};BdScrollImage.Controller.prototype.start=function(){this.timer=window.setInterval(window[this.scrollFuncName],this.interval)};BdScrollImage.Controller.prototype.stop=function(){window.clearInterval(this.timer)};BdScrollImage.Controller.prototype.handleMessage=function(a){switch(a.type){case"START":this.start(this.interval);break;case"STOP":this.stop();break;case"RESTART":this.stop();this.start(this.interval);break;default:break}};BdScrollImage.Controller.prototype.registerEvent=function(){var b=Math.random(),a=this;window[b]=function(){a.start()};if(window.attachEvent){window.attachEvent("onload",window[b])}else{window.addEventListener("load",window[b],false)}};BdScrollImage.View=function(a,b){this.domObj=a;this.dataSource=b;this.curIndex=1;this.imgLink=a.getElementsByTagName("a")[0];this.imgObj=a.getElementsByTagName("img")[0];this.observers=[]};BdScrollImage.View.prototype.handleMessage=function(d){var a=this.dataSource,c=d.type;switch(c){case"SCROLL":var b=d.param;this.imgLink.href=a[b-1]["url"];this.imgObj.src=a[b-1]["imgUrl"];this.imgLink.setAttribute("mon","ct=1&a=12&pn="+b+"&col=4");break;default:break}};BdScrollImage.View.prototype.registerEvent=function(){var a=this;(function(){function b(c){c=c||window.event;switch(c.type){case"mouseover":a.notify({type:"STOP"});return;case"mouseout":a.notify({type:"START"});return;default:return}}if(window.attachEvent){a.imgObj.attachEvent("onmouseover",b);a.imgObj.attachEvent("onmouseout",b)}else{a.imgObj.addEventListener("mouseover",b,false);a.imgObj.addEventListener("mouseout",b,false)}})()};BdScrollImage.Title=function(a,b){this.domObj=a;this.dataSource=b;this.curIndex=1;this.linkObj=a.getElementsByTagName("a")[0];this.observers=[]};BdScrollImage.Title.prototype.handleMessage=function(d){var a=this.dataSource,c=d.type;switch(c){case"SCROLL":var b=d.param;this.linkObj.href=a[b-1]["url"];this.linkObj.innerHTML=a[b-1]["title"];this.linkObj.setAttribute("mon","ct=1&a=9&pn="+b+"&col=4");break;default:break}};BdScrollImage.Title.prototype.registerEvent=function(){var a=this;(function(){function b(c){c=c||window.event;switch(c.type){case"mouseover":a.notify({type:"STOP"});return;case"mouseout":a.notify({type:"START"});return;default:return}}if(window.attachEvent){a.linkObj.attachEvent("onmouseover",b);a.linkObj.attachEvent("onmouseout",b)}else{a.linkObj.addEventListener("mouseover",b,false);a.linkObj.addEventListener("mouseout",b,false)}})()};BdScrollImage.ImageList=function(a){this.iL=a};BdScrollImage.ImageList.prototype.init=function(){var a=this.iL,c,d=new Date();window[d.getTime()]=[];if(a){for(var b=0;b<a.length;b++){window[d.getTime()][b]=new Image();window[d.getTime()][b].src=a[b]["imgUrl"]}}};function implement(a,c){for(var b in a){c[b]=a[b]}}var Observable=(function(){function a(c){if(c&&typeof c=="object"&&c.handleMessage){this.observers.push(c)}}function b(d){var e=this.observers;for(var c=0;c<e.length;c++){e[c].handleMessage(d)}}return{addObserver:a,notify:b}})();implement(Observable,BdScrollImage.Navigator.prototype);implement(Observable,BdScrollImage.View.prototype);implement(Observable,BdScrollImage.Title.prototype);implement(Observable,BdScrollImage.Controller.prototype);
</script>
</head>
<style>
/*--scrolling image--*/
.scrollingimg{width:228px; background:#EBEBEB; position:relative; text-align:center}
.imgview{clear:both; width:228px; height:162px; text-align:center}
.imgnav{width:65px; height:20px; position:absolute; bottom:25px; right:0; text-align:center; overflow:hidden; margin-right:3px; margin-bottom:2px}
.imgtitle{ height:24px; overflow:hidden; text-align:center; 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>
<br><br><br><br><br><br><br>
<table><tr>
<td width="103">sdfsdf</td>
<td width="896" align="center">
<div class="scrollingimg" id="scrollingImg">
<div class="imgview" id="imgView">
<a href="" target="_blank">
<img class="firstimg" alt="" border="0">
</a>
</div>
<div class="imgnav" id="imgNav">
<a class="navbtn" index="3" href="javascript:void(0)">3</a>
<a class="navbtn" index="2" href="javascript:void(0)">2</a>
<a class="navbtn" index="1" 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:///photo/upload/2012261511532012.jpg'
});
imgList.push({
'title':'亿万富豪为父祝寿请上万宾客',
'url':'http://focus.scol.com.cn/zgsz/20090808/20098835724.htm',
'imgUrl':'http://news/photo/upload/2012261511532012.jpg'
});
imgList.push({
'title':'11矽肺民工维权 等待中5人离世',
'url':'http://news.xinmin.cn/rollnews/2009/08/08/2351299.html',
'imgUrl':'http://news/upload/2012261511532012.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>
</td>
<td width="153">sdfasdfsadf</td>
</tr></table>
</body>
</html>
