csdn首页也是如此。我无聊，自己写了一个，特点如下：

1.对搜索引擎友好
2.对美工友好，因为数据和代码是分开的，完全不懂js的都可以用fontpage修改动画内容

可以把js代码保存为一个文件 然后,然后无须修改代码一个字母
就可以在多个页面中实现动画了

代码如下:

 代码如下:
 
href="#" target=_blank>id="g_img" style="FILTER:revealTrans(duration=1,transition=23);width:266px;height:220px;border:1px green solid" src="http://zi.csdn.net/xian.gif"> 
href="http://www.baidu.com/" for="http://zi.csdn.net/xian.gif" target="_blank">1.CSDN程序员href="http://www.126.com/" for="http://zi.csdn.net/microsoft280_187.jpg" target="_blank">2.CSDN程序员href="http://mp3.baidu.com/" for="http://zi.csdn.net/live.gif" target="_blank">3.CSDN程序员href="http://post.baidu.com/" for="http://zi.csdn.net/new-mba.gif" target="_blank">4.CSDN程序员href="http://top.baidu.com/" for="http://zi.csdn.net/book.jpg" target="_blank">5.CSDN程序员 
 
 
function f(){ 
 var g_sec=3 //几秒后切换图片 
 var g_items=new Array() 
 var g_div=document.getElementById("g_div") 
 var g_img=document.getElementById("g_img") 
 var g_imglink=g_img.parentElement 
 var arr=g_div.getElementsByTagName("A") 
 var arr_length=arr.length 
 var g_index=1 
 var show_img=function(n){ 
 if (/\d+/.test(n)){ 
 var prev=g_index+1 
 g_index=n-1 
 }else{ 
 var prev=(g_index>arr.length)?(arr_length-1):g_index+1 
 g_index=(g_index } 
 if (document.all){ 
 g_img.filters.revealTrans.Transition=23; 
 g_img.filters.revealTrans.apply(); 
 g_img.filters.revealTrans.play(); 
 } 
 arr[prev].className="b" 
 arr[g_index+1].className="bhover" 
 g_img.src=g_items[g_index].img.src 
 g_img.title=g_items[g_index].txt 
 g_imglink.href=g_items[g_index].url 
 g_imglink.target=g_items[g_index].target 
 } 
 for(var i=1;i g_items.push({txt:arr[i].innerHTML, 
 url:arr[i].href, 
 target:arr[i].target, 
 img:(function(){var o=new Image;o.src=arr[i].getAttribute("for");return o})()}) 
 arr[i].title=arr[i].innerHTML 
 arr[i].innerHTML=[i," "].join("") 
 arr[i].className="b" 
 arr[i].onclick=function(){ 
 event.returnValue=false; 
 show_img(event.srcElement.innerText) 
 } 
 } 
 show_img(1) 
 var t=window.setInterval(show_img,g_sec*1000) 
 g_img.onmouseover=function(){window.clearInterval(t)} 
 g_img.onmouseout=function(){t=window.setInterval(show_img,g_sec*1000)} 
} 
window.attachEvent("onload",f) 
 
 




下载本文