由于.aspx和.html的解析方式不一样,滚动也出现了一些问题,让我无语,总算解决!具体代码如下:
1 .文字向上滚动,结合后台代码
2.图片左右滚动,具体代码如下:
1 .文字向上滚动,结合后台代码
Code
1<div id="maq" style="overflow:hidden;height:160px;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>
1<div id="maq" style="overflow:hidden;height:160px;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; 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>
<div id="demo" style="overflow: hidden; 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>