1. XHTML code:
1 <Div id = "Demo">
2 <Div id = "indemo">
3 <Div id = "demo1">
4 <div>
5 <a href = "#" Title = ""> </a>
6 <a href = "#" Title = ""> </a>
7 <a href = "#" Title = ""> </a>
8 <a href = "#" Title = ""> </a>
9 </div>
10 </div>
11 <Div id = "demo2"> </div>
12 </div>
13 </div>
2. JavaScript code:
<SCRIPT type = "text/JavaScript">
<! --
VaR speed = 8; // The greater the number, the slower the speed.
VaR tab = Document. getelementbyid ("Demo ");
VaR tab1 = Document. getelementbyid ("demo1 ");
VaR tab2 = Document. getelementbyid ("demo2 ");
Tab2.innerhtml = tab1.innerhtml;
Function marquee (){
If (tab2.offsetwidth-tab. scrollleft <= 0)
Tab. scrollleft-= tab1.offsetwidth
Else
{
Tab. scrollleft ++;
}
}
VaR mymar = setinterval (marquee, speed );
Tab. onmouseover = function () {clearinterval (mymar )};
AB. onmouseout = function () {mymar = setinterval (marquee, speed )};
// -->
</SCRIPT>
Note: tab. scrollleft scroll to the left; tab. scrolltop scroll up; tab. scrollright scroll to the right; tab. scrolldown scroll down.
3. CSS
# Demo {overflow: hidden; width: 820px; margin-left: 8px ;}
# Demo a IMG {border: 3px double # f2f2f2 ;}
# Indemo {float: Left; width: 800%; Height: 100px ;}
# Demo1 {float: Left ;}
# Demo2 {float: Left ;}