IE,FF通用的JavaScript滾動字幕


在遊網站時發現的一個東東..
這效果一直想找的,可是由於常常忘了,所以這次就先記下來吧

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<style type="text/css">
* {font-size:12px;font-family:Verdana,Tahoma;padding:0;margin:0;}
body {padding: 30px; }
a {color: #339933; text-decoration: none; }
a:hover {color: #F60; }
#andyscroll {overflow: hidden;height:36px;background: #F9F9F9;padding: 0 10px;border: 1px solid #E0E0E0;width:300px;}
#scrollmessage ul {list-style:none; padding:0; margin:0;}
#scrollmessage li {line-height: 18px;}
</style>

<div id="andyscroll">
<div id="scrollmessage">
<ul>
<li><a href="http://hk.yahoo.com/">Yahoo HongKong</a></li>
<li><a href="http://google.com.hk/">Google HongKong</a></li>
<li><a href="http://msn.com.hk/">MSN HongKong</a></li>
<li><a href="http://zeuik.com/">What do you want to know ?</a></li>
</ul>
</div>
</div>

<script type="text/javascript">
<!--
try{
var stopscroll = false;
var scrollElem = document.getElementById("andyscroll");

with(scrollElem){
style.overflow = 'hidden';
noWrap = true;
}

scrollElem.onmouseover = new Function('stopscroll = true');
scrollElem.onmouseout = new Function('stopscroll = false');

var preTop = 0;
var currentTop = 0;
var stoptime = 0;
var leftElem = document.getElementById("scrollmessage");

scrollElem.appendChild(leftElem.cloneNode(true));
init_srolltext();
}catch(e){
}

function init_srolltext(){
scrollElem.scrollTop = 0;
setInterval('scrollUp()', 40);
}

function scrollUp(){
if(stopscroll) return;
currentTop += 1;

if(currentTop == 19) {
stoptime += 1;
currentTop -= 1;

if(stoptime == 30) {
currentTop = 0;
stoptime = 0;
}
}else{
preTop = scrollElem.scrollTop;
scrollElem.scrollTop += 1;

if (preTop == scrollElem.scrollTop) {
scrollElem.scrollTop = 0;
scrollElem.scrollTop += 1;
}
}
}
//-->
</script>