<HTML>
<Head>
<Title> scroll effect </title>
</Head>
<Body style = "overflow: hidden; Border: 0" topmargin = 0 leftmargin = 0>
<Body>
<Div id = "marquees"> <! -- These are subtitle content, which you can define at will -->
<Table>
<Tr>
<TD>
Dddddddddddd
</TD>
</Tr>
<Tr>
<TD>
D11111111111
</TD>
</Tr>
</Table>
</Div>
<! -- The following is the JavaScript code -->
<Script language = "JavaScript">
<! --
Marqueesheight = 200; // content area height
Stopscroll = false; // This variable controls whether to stop scrolling.
With (marquees ){
Nowrap = true; // The content area of this table does not automatically wrap.
Style. width = 0; // we can set its width to 0, because it will be extended.
Style. Height = marqueesheight;
Style. overflowy = "hidden"; // the scroll bar is invisible.
Onmouseover = new function ("stopscroll = true"); // move the mouse over to stop scrolling.
Onmouseout = new function ("stopscroll = false"); // move the mouse away to start rolling.
}
// At this time, the height of the content area cannot be read. The following output is an invisible layer "templayer", and the content will be copied to it later:
Document. Write ('<Div id = "templayer" style = "position: absolute; Z-index: 1; visibility: hidden"> </div> ');
Function Init () {// initialize the scrolling content
// Copy the original content multiple times to "templayer" until the height of "templayer" is greater than that of the content area:
While (templayer. offsetheight <marqueesheight ){
Templayer. innerhtml + = marquees. innerhtml;
} // Copy twice the content of "templayer" to the original content area:
Marquees. innerhtml = templayer. innerhtml + templayer. innerhtml;
// Set the continuous timeout. Call the "scrollup ()" function to drive the scroll bar:
Setinterval ("scrollup ()", 20 );
}
Document. Body. onload = Init;
Pretop = 0; // This variable is used to determine whether the scroll bar has reached its end.
Function scrollup () {// The driver function of the scroll bar
If (stopscroll = true) return; // If the variable "stopscroll" is true, stop scrolling.
Pretop = marquees. scrolltop; // record the position of the scroll bar before scrolling
Marquees. scrolltop + = 1; // the scroll bar moves down a pixel.
// If the scroll bar does not move, it will scroll up to the same position as the current screen.
// Of course not only that, but also to scroll down a pixel (+ 1 ):
If (pretop = marquees. scrolltop ){
Marquees. scrolltop = templayer. offsetheight-marqueesheight + 1;
}
}
-->
</SCRIPT>
Dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
</Body>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
