迅雷新闻快讯区JS代码剖析

迅雷新闻快讯以前原这样是flash，今天突然发现是js Coding出来。所以我就分析一下。以备后用。
文件下载：XunleiPicChange 

<div class="flashBox"> 
2  <div id="Switch_0" class="SwitchPic"> 
3     <a  href="xxx.html" onmouseover="pauseSwitch();" 
            onmouseout="goonSwitch();" blockid="938"> 
4        <img src="上方显示的大图片" alt="安室奈美惠"> 
5     </a> 
6   </div>
8.
10   <ul class="sPic">//而这部分则是负责显示下方的小图片 
11      <li id="LittleSwitch_0"> 
12       <a  href="javascript:goManSwitch(0);" target="_self" 
              title="安室奈美惠" blockid="938"> 
13           <img src="下方显示的小图片" alt="安室奈美惠" /> 
14       </a> 
15      </li>
17
19</div>

Code
1
2核心的JS代码，类于走马灯的效果，代码比较简单，看看即可
3
4<script>
5var SwitchTitles = new Array();
6SwitchTitles[0] = Array() ;
7SwitchTitles[0]['title'] = "安室奈美惠" ;
8SwitchTitles[0]['stitle'] = "不满儿子遭偷拍 起诉日八卦杂志" ;
9SwitchTitles[0]['link'] = "http://music.xunlei.com/contents/2b/22026.shtml" ;
10SwitchTitles[1] = Array() ;
11SwitchTitles[1]['title'] = "陈慧琳十月摆酒" ;
12SwitchTitles[1]['stitle'] = "十月二日在洲际酒店开席大宴亲朋" ;
13SwitchTitles[1]['link'] = "http://music.xunlei.com/contents/9a/22162.shtml" ;
14SwitchTitles[2] = Array() ;
15SwitchTitles[2]['title'] = "萧亚轩" ;
16SwitchTitles[2]['stitle'] = "着别致小礼服 内衣外穿展现性感一面" ;
17SwitchTitles[2]['link'] = "http://music.xunlei.com/contents/cf/22328.shtml" ;
18SwitchTitles[3] = Array() ;
19SwitchTitles[3]['title'] = "F4开演唱会" ;
20SwitchTitles[3]['stitle'] = "日本演唱会门票被炒高四倍" ;
21SwitchTitles[3]['link'] = "http://music.xunlei.com/contents/78/21906.shtml" ;
22
23var CurScreen = 0 ;
24var MaxScreen = 4 ;
25var g_pre_screen = -1 ;
26
27function switchPic(screen) {
28
29if (screen >= MaxScreen) {
30screen = 0 ;
31}
32if (g_pre_screen == -1) {
33if (screen == 0) {
34var pre_screen = MaxScreen - 1 ;
35}
36else {
37var pre_screen = screen - 1 ;
38}
39}
40else {
41var pre_screen = g_pre_screen ;
42}
43for (i=0;i<MaxScreen;i++) {
44document.getElementById("Switch_"+i).style.display = "none" ;
45}
46Effect.Appear("Switch_"+screen);
47
48switchLittlePic(screen);
49showSwitchTitles(screen);
50CurScreen = screen  ;
51g_pre_screen = -1 ;
52}
53function switchLittlePic(screen) {
54for (i=0;i<MaxScreen;i++) {
55document.getElementById("LittleSwitch_"+i).className = "" ;
56}
57document.getElementById("LittleSwitch_"+screen).className = "currA" ;
58}
59function showSwitchTitles(screen) {
60document.getElementById("SwitchTitle").innerHTML = '' ;
61Effect.BlindDown('SwitchTitle');
62document.getElementById("SwitchTitle").innerHTML = '<a href="'+SwitchTitles[screen]['link']+'" style="color:#fff;cursor:pointer;text-decoration:none;"><h6>'+SwitchTitles[screen]['title']+'</h6><p class="sm">'+SwitchTitles[screen]['stitle']+'</a></p>' ;
63}
64function reSwitchPic() {
65refreshSwitchTimer = null;
66switchPic(CurScreen+1);
67refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
68}
69function pauseSwitch() {
70clearTimeout(refreshSwitchTimer);
71}
72function goonSwitch() {
73clearTimeout(refreshSwitchTimer);
74refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
75}
76function goManSwitch(index) {
77clearTimeout(refreshSwitchTimer);
78CurScreen = index -1 ;
79reSwitchPic();
80}
81switchPic(CurScreen);
82refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
83</script>