由于.aspx和.html的解析方式不一样,滚动也出现了一些问题,让我无语,总算解决!具体代码如下:
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>
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>
1 .文字向上滚动,结合后台代码


1

2

3



4

5

6

7

8

9

10

11

12

13

14

15

16

17



18

19

20

21

22

23

24



25

26

27



28

29

30



31

32

33

34

35



36



37

2.图片左右滚动,具体代码如下:


<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>