Javascript:通用不间断滚动&省、市、地区联动选择JS封装类
通用不间断滚动JS封装类&省、市、地区联动选择JS封装类
官方主页: http://www.popub.net/script/MSClass.html
一 环境:XP+Myeclipse6.5+Tomcat7
二 简单示例:详见工程附件
1 文字上下滚动

<style type="text/css">
		body,div{margin:0;font-size:12px}
		td.data{font-size: 12px;line-height: 20px;color: #666}		
		#context{
				width: 500px;
				height: 300px;		
				margin-top:10%;
				margin-left:30%;		
				font-size:13px; 
				color:#003c79;
				background:#f4f5f9; 
				border:solid 1px #d0d6e9;
		}		
	</style>
    <script type="text/javascript" src="scripts/MSClass.js" charset="gb2312"></script>
    <script type="text/javascript" charset="gbk">
	      window.onload = function(){
	       new Marquee("context",-1,1,600,400,50,5000,1000,290);
		}
	</script>

<div id="context">
         <table>
			<tr>
				<td class="data">
				<p>     
...
</p>
		</td>
	   </tr>	   
	  </table>
      </div>

2 箭头控制滚动方向、加速及鼠标拖动实例

<table border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<td><a href="javascript:void(0);" id="LeftButton2" hidefocus><img src="images/right.gif"  border="0"></a></td>
<td width="10"></td>
<td valign="top" width="477">
	<div ID="MarqueeDiv2" style="width:477px;overflow:hidden;">
	    <TABLE style="WIDTH:800px; BORDER-COLLAPSE: collapse;display:inline;" cellSpacing=0 cellPadding=0 align=center border=0>
		<TBODY>
		<TR>
			<TD width="160" align="center" height="145">
				<A href="javascript:void(0)"><IMG src="images/1.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接1</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/2.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接2</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/3.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接3</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/4.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接4</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/5.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接5</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/6.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接6</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/7.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接7</A> 
			</TD>
			<TD width="160" align="center">
				<A href="javascript:void(0)"><IMG src="images/8.jpg" border=0 width="150" height="120"></A><br/>
				<A href="javascript:void(0)">链接8</A> 
			</TD>
		</TR>
		</TBODY>
		</TABLE>
	</div>
</td>
<td width="10"></td>
<td><a href="javascript:void(0);" id="RightButton2" hidefocus><img src="images/left.gif" border="0"></a></td></tr>
</table>

<script defer>
function $(id){return document.getElementById(id)};

/*********箭头控制滚动方向、加速及鼠标拖动*************