<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> Untitled Document </title>
<script type= "Text/javascript" src= "Marquee.js" ></script>
<style type= "Text/css" >
<!--
* {
margin:0;
padding:0;
}
#demo {
/********* must be guaranteed beyond the width to be able to scroll *********/
width:600px;/* Visual Area Width * *
Overflow:hidden;
/********* must be guaranteed beyond the width to be able to scroll *********/
height:80px;
}
#demo1, #demo2 {
width:800px;/* whole picture Width * *
Float:left;
}
#demo img{
Display:block;
Float:left;
}
#demo Li {
Float:left;
width:60px;
height:80px;
}
-->
<!--
#demo0 {
/********* must be guaranteed beyond the width to be able to scroll *********/
width:600px;/* Visual Area Width * *
Overflow:hidden;
/********* must be guaranteed beyond the width to be able to scroll *********/
height:80px;
}
#demo11, #demo22 {
width:1020px;/* whole picture Width * *
Display:block;
height:80px;
}
#demo0 Li {
Float:left;
margin:0 5px;
width:60px;
height:80px;
}
-->
</style>
<body>
<!--structure must be--<div class= "Demo" >
<div class= "Demo1" ></div>
<div class= "Demo2" ></div>
</div>--structure must be ——-->
<div id= "Demo" >
<ul id= "Demo1" >
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
</ul>
<ul id= "Demo2" ></ul>
</div>
<!--<div id= "Demo0" >
<div id= "Demo11" >
<ul>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
<li><a href= "#" ></a> </li>
</ul>
</div>
<div id= "Demo22" ></div>
</div>-->
<script>
ToLeft ("Demo", "Demo1", "Demo2", "Onedemo");
ToRight ("Demo0", "demo11", "Demo22", "Ti2");
</script>
</body>
JavaScript Seamless scrolling up and down and fixed Gao Dingkuan pause effect (compatible with IE/FF)
