Up
Copy codeThe Code is as follows:
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Title> continuous upward scrolling </title>
<Style type = "text/css">
<! --
Body {
Font-size: 9pt;
Color: #000000;
}
A {
Color: # 0000FF;
Text-decoration: none;
}
A: hover {
Color: # FF0000;
Text-decoration: underline;
}
-->
</Style>
</Head>
<Body>
<Div id = "marquees"> <a href = "#"> link 1 </a> <br>
<Br>
<A href = "#"> link 2 </a> <br>
<Br>
<A href = "#"> link 3 </a> <br>
<Br>
<A href = "#"> Link 4 </a> <br>
<Br>
</Div>
<Script language = "JavaScript">
MarqueesHeight = 200;
Stopscroll = false;
With (marquees ){
Style. width = 0;
Style. height = marqueesHeight;
Style. overflowX = "visible ";
Style. overflowY = "hidden ";
NoWrap = true;
Onmouseover = new Function ("stopscroll = true ");
Onmouseout = new Function ("stopscroll = false ");
}
Document. write ('<div id = "templayer" style = "position: absolute; z-index: 1; visibility: hidden"> </div> ');
PreTop = 0; currentTop = 0;
Function init (){
Templayer. innerHTML = "";
While (templayer. offsetHeight <marqueesHeight ){
Templayer. innerHTML + = marquees. innerHTML;
}
Marquees. innerHTML = templayer. innerHTML + templayer. innerHTML;
SetInterval ("scrollUp ()", 100 );
}
Document. body. onload = init;
Function scrollUp (){
If (stopscroll = true) return;
PreTop = marquees. scrollTop;
Marquees. scrollTop + = 1;
If (preTop = marquees. scrollTop ){
Marquees. scrollTop = templayer. offsetHeight-marqueesHeight;
Marquees. scrollTop + = 1;
}
}
</Script>
</Body>
</Html>
Down
Copy codeThe Code is as follows:
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Title> continuous downward scrolling </title>
<Style type = "text/css">
<! --
Body {
Font-size: 9pt;
Color: #000000;
}
A {
Color: # 0000FF;
Text-decoration: none;
}
A: hover {
Color: # FF0000;
Text-decoration: underline;
}
-->
</Style>
</Head>
<Body>
<Div id = "marquees"> <a href = "#"> link 1 </a> <br>
<Br>
<A href = "#"> link 2 </a> <br>
<Br>
<A href = "#"> link 3 </a> <br>
<Br>
<A href = "#"> Link 4 </a> <br>
<Br>
</Div>
<Script language = "JavaScript">
MarqueesHeight = 200;
With (marquees ){
Style. width = 0;
Style. height = marqueesHeight;
Style. overflowX = "visible ";
Style. overflowY = "hidden ";
NoWrap = true;
Onmouseover = new Function ("stopscroll = true ");
Onmouseout = new Function ("stopscroll = false ");
}
Document. write ('<div id = "templayer" style = "position: absolute; z-index: 1; visibility: hidden"> </div> ');
PreTop = 0; currentTop = 0; getlimit = 0; stopscroll = false;
Function init (){
Templayer. innerHTML = "";
While (templayer. offsetHeight <marqueesHeight ){
Templayer. innerHTML + = marquees. innerHTML;
}
Marquees. innerHTML + = templayer. innerHTML;
SetInterval ("scrollDown ()", 10 );
} Init ();
Function scrollDown (){
If (stopscroll = true) return;
PreTop = marquees. scrollTop;
Marquees. scrollTop-= 1;
If (preTop = marquees. scrollTop ){
If (! Getlimit ){
Marquees. scrollTop = templayer. offsetHeight * 2;
Getlimit = marquees. scrollTop;
}
Marquees. scrollTop = getlimit-templayer.offsetHeight + marqueesHeight;
Marquees. scrollTop-= 1;
}
}
</Script>
</Body>
</Html>
Left
Copy codeThe Code is as follows:
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Title> continuous left scrolling </title>
<Style type = "text/css">
<! --
Body {
Font-size: 9pt;
Color: #000000;
}
A {
Color: # 0000FF;
Text-decoration: none;
}
A: hover {
Color: # FF0000;
Text-decoration: underline;
}
-->
</Style>
</Head>
<Body>
<Div id = "marquees"> <a href = "#"> link 1 </a> <a href = "#"> link 2 </a> <a href = "#"> link 3 </a> <a href = "#"> Link 4 </a> </div>
<Div id = "templayer" style = "position: absolute; left: 0; top: 0; visibility: hidden"> </div>
<Script language = "JavaScript">
MarqueesWidth = 200;
With (marquees ){
Style. height = 0;
Style. width = marqueesWidth;
Style. overflowX = "hidden ";
Style. overflowY = "visible ";
NoWrap = true;
Onmouseover = new Function ("stopscroll = true ");
Onmouseout = new Function ("stopscroll = false ");
}
PreLeft = 0; currentLeft = 0; stopscroll = false;
Function init (){
Templayer. innerHTML = "";
While (templayer. offsetWidth <marqueesWidth ){
Templayer. innerHTML + = marquees. innerHTML;
}
Marquees. innerHTML + = templayer. innerHTML;
SetInterval ("scrollLeft ()", 100 );
} Init ();
Function scrollLeft (){
If (stopscroll = true) return;
PreLeft = marquees. scrollLeft;
Marquees. scrollLeft + = 1;
If (preLeft = marquees. scrollLeft ){
Marquees. scrollLeft = templayer. offsetWidth-marqueesWidth + 1;
}
}
</Script>
</Body>
</Html>
Right
Copy codeThe Code is as follows:
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Title> scroll right consecutively </title>
<Style type = "text/css">
<! --
Body {
Font-size: 9pt;
Color: #000000;
}
A {
Color: # 0000FF;
Text-decoration: none;
}
A: hover {
Color: # FF0000;
Text-decoration: underline;
}
-->
</Style>
</Head>
<Body>
<Div id = "marquees"> <a href = "#"> link 1 </a> <a href = "#"> link 2 </a> <a href = "#"> link 3 </a> <a href = "#"> Link 4 </a> </div>
<Div id = "templayer" style = "position: absolute; left: 0; top: 0; visibility: hidden"> </div>
<Script language = "JavaScript">
MarqueesWidth = 200;
With (marquees ){
Style. height = 0;
Style. width = marqueesWidth;
Style. overflowX = "hidden ";
Style. overflowY = "visible ";
NoWrap = true;
Onmouseover = new Function ("stopscroll = true ");
Onmouseout = new Function ("stopscroll = false ");
}
PreTop = 0; currentTop = 0; getlimit = 0; stopscroll = false;
Function init (){
Templayer. innerHTML = "";
While (templayer. offsetWidth <marqueesWidth ){
Templayer. innerHTML + = marquees. innerHTML;
}
Marquees. innerHTML + = templayer. innerHTML;
SetInterval ("scrollRight ()", 10 );
} Init ();
Function scrollRight (){
If (stopscroll = true) return;
PreLeft = marquees. scrollLeft;
Marquees. scrollLeft-= 1;
If (preLeft = marquees. scrollLeft ){
If (! Getlimit ){
Marquees. scrollLeft = templayer. offsetWidth * 2;
Getlimit = marquees. scrollLeft;
}
Marquees. scrollLeft = getlimit-templayer.offsetWidth + marqueesWidth;
Marquees. scrollLeft-= 1;
}
}
</Script>
</Body>
</Html>