在.aspx页实现滚动
由于.aspx和.html的解析方式不一样，滚动也出现了一些问题，让我无语，总算解决！具体代码如下：
1 .文字向上滚动，结合后台代码
Code
1
<div id="maq" style="overflow:hidden;height:160px;width:300px;">
2 <div id="mtext">
3 <%
4
string strUrl = null;
5 string strName = null;
6
7 string sqlTemp = "SELECT sc.*,sb.url FROM Scms_smallclass as sc,Scms_sub_company as sb WHERE sc.bh=sb.SubId";
8
9 DataSet dsMarquee = SQLHelper.DataAdapter(sqlTemp, SQLHelper.SDACmd.select, "sqlTemp");
10
11 for (int i = 0; i < dsMarquee.Tables[0].Rows.Count; i++)
12 {
13 strUrl = dsMarquee.Tables[0].Rows[i]["url"].ToString();
14 strName = dsMarquee.Tables[0].Rows[i]["smallchinesename"].ToString();
15
%>
16 <a href="<%=strUrl %>"><%=strName %></a><br /><br />
17 <%
18 } %>
19
20 </div>
21 <div id="m0"></div>
22 </div>
23
24 <script type="text/javascript">
25 var speed=40 //调整滚动速度
26 m0.innerHTML=mtext.innerHTML
27
function Marquee(){
28 if(m0.offsetTop-maq.scrollTop<=0)
29 maq.scrollTop-=mtext.offsetHeight
30 else{
31 maq.scrollTop++
32
}
33 }
34 var MyMar=setInterval(Marquee,speed)
35 maq.onmouseover=function() {clearInterval(MyMar)}
36 maq.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
37 </script>
2.图片左右滚动，具体代码如下：
Code
<div id="demo" style="overflow: hidden; width: 100%;">
<table align="left" cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="demo1" valign="top">
<table width="100%" height="100%" border="0">
<tr>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/57.html">
<img alt="" src="Images/1.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/57.html">2008-10-6<br />
福温高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/58.html">
<img alt="" src="Images/2.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/58.html">2008-9-20<br />
福宁高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/59.html">
<img alt="" src="Images/3.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/59.html">2008-9-20<br />
长乐飞机场</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/60.html">
<img alt="" src="Images/4.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/60.html">2008-10-22<br />
三环建设</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/61.html">
<img alt="" src="Images/5.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/61.html">2008-11-5<br />
海湾大桥</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/62.html">
<img alt="" src="Images/6.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/62.html">2008-11-20<br />
福宁高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/63.html">
<img alt="" src="Images/7.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/63.html">2008-9-20<br />
美菰林隧道完工</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td id="demo2" valign="top">
</td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
var leftspeed = 30;
demo2.innerHTML = demo1.innerHTML
function MarqueeLeft(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}}
var MyMarleft = setInterval(MarqueeLeft, leftspeed)
demo.onmouseover=function() {clearInterval(MyMarleft)}
demo.onmouseout=function() {MyMarleft=setInterval(MarqueeLeft,leftspeed)}
</script>
1 .文字向上滚动，结合后台代码
Code1
<div id="maq" style="overflow:hidden;height:160px;width:300px;"> 2
<div id="mtext"> 3
<%4
string strUrl = null;5
string strName = null;6
7
string sqlTemp = "SELECT sc.*,sb.url FROM Scms_smallclass as sc,Scms_sub_company as sb WHERE sc.bh=sb.SubId";8
9
DataSet dsMarquee = SQLHelper.DataAdapter(sqlTemp, SQLHelper.SDACmd.select, "sqlTemp");10
11
for (int i = 0; i < dsMarquee.Tables[0].Rows.Count; i++)12
{13
strUrl = dsMarquee.Tables[0].Rows[i]["url"].ToString();14
strName = dsMarquee.Tables[0].Rows[i]["smallchinesename"].ToString();15
%> 16
<a href="<%=strUrl %>"><%=strName %></a><br /><br /> 17
<%18
} %> 19
20
</div> 21
<div id="m0"></div> 22
</div> 23
24
<script type="text/javascript"> 25
var speed=40 //调整滚动速度 26
m0.innerHTML=mtext.innerHTML 27
function Marquee(){ 28
if(m0.offsetTop-maq.scrollTop<=0) 29
maq.scrollTop-=mtext.offsetHeight 30
else{ 31
maq.scrollTop++ 32
} 33
} 34
var MyMar=setInterval(Marquee,speed) 35
maq.onmouseover=function() {clearInterval(MyMar)} 36
maq.onmouseout=function() {MyMar=setInterval(Marquee,speed)} 37
</script> 2.图片左右滚动，具体代码如下：
Code<div id="demo" style="overflow: hidden; width: 100%;">
<table align="left" cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="demo1" valign="top">
<table width="100%" height="100%" border="0">
<tr>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/57.html">
<img alt="" src="Images/1.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/57.html">2008-10-6<br />
福温高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/58.html">
<img alt="" src="Images/2.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/58.html">2008-9-20<br />
福宁高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/59.html">
<img alt="" src="Images/3.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/59.html">2008-9-20<br />
长乐飞机场</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/60.html">
<img alt="" src="Images/4.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/60.html">2008-10-22<br />
三环建设</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/61.html">
<img alt="" src="Images/5.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/61.html">2008-11-5<br />
海湾大桥</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/62.html">
<img alt="" src="Images/6.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/62.html">2008-11-20<br />
福宁高速公路</a>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/63.html">
<img alt="" src="Images/7.jpg" style="border: 0px;" /></a></td>
</tr>
<tr>
<td align="center">
<a href="/CmsTeam/Articls/ProjectDisplay/34/63.html">2008-9-20<br />
美菰林隧道完工</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td id="demo2" valign="top">
</td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
var leftspeed = 30;
demo2.innerHTML = demo1.innerHTML
function MarqueeLeft(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}}
var MyMarleft = setInterval(MarqueeLeft, leftspeed)
demo.onmouseover=function() {clearInterval(MyMarleft)}
demo.onmouseout=function() {MyMarleft=setInterval(MarqueeLeft,leftspeed)}
</script>
