如何实现repeater的走马灯效果

<form id= "Form3 " method= "post " runat= "server ">


<FONT face= "宋体 "> </FONT>


<TABLE id= "Table1 " style= "WIDTH: 800px; HEIGHT: 136px " cellSpacing= "0 " cellPadding= "0 "


border= "0 ">


<TR>


<TD>


<div id= "demo " style= "OVERFLOW: hidden; WIDTH: 1000px; HEIGHT: 125px " align= "center "


DESIGNTIMEDRAGDROP= "134 ">


<TABLE style= "WIDTH: 725px; HEIGHT: 96px ">


<TR>


<TD id= "demo1 " vAlign= "middle "> <asp:datalist id= "DataList1 " runat= "server " Width= "712px " RepeatDirection= "Horizontal ">


<ItemTemplate>


<FONT face= "宋体 ">


<TABLE id= "Table2 " style= "WIDTH: 102px; HEIGHT: 100px " cellSpacing= "0 " cellPadding= "0 "


width= "102 " border= "0 ">


<TR>


<TD> <IMG style= "WIDTH: 98px; HEIGHT: 95px " height=95 alt=产品照片 src= ' <%# DataBinder.Eval(Container.DataItem, "Pimg ", "upimg/{0} ")%> ' width=98 border=0> </TD>


</TR>


<TR>




<TD align= "center "> <A href= 'Productinfo.aspx?Pid= <%#DataBinder.Eval(Container.DataItem, "id ")%> ' target=_blank> <%...# DataBinder.Eval(Container.DataItem, "Pname ")%> </A> </TD>


</TR>


</TABLE>


</FONT>


</ItemTemplate>


<AlternatingItemTemplate>


<TABLE id= "Table4 " style= "WIDTH: 102px; HEIGHT: 117px " cellSpacing= "0 " cellPadding= "0 "


width= "102 " border= "0 ">


<TR>


<TD> <IMG style= "WIDTH: 98px; HEIGHT: 95px " height=95 alt=产品照片 src= ' <%# DataBinder.Eval(Container.DataItem, "Pimg ", "upimg/{0} ")%> ' width=98 border=0> </TD>


</TR>


<TR>




<TD align= "center "> <A href= 'Productinfo.aspx?Pid= <%#DataBinder.Eval(Container.DataItem, "id ")%> ' target=_blank> <%...# DataBinder.Eval(Container.DataItem, "Pname ")%> </A> </TD>


</TR>


</TABLE>


</AlternatingItemTemplate>


</asp:datalist> </TD>


<TD id= "demo2 " vAlign= "top "> <FONT face= "宋体 "> </FONT> </TD>


</TR>


</TABLE>


</div>


</TD>


</TR>


</TABLE>




<script>...


var Picspeed=30


demo2.innerHTML=demo1.innerHTML




function Marquee1()...{


if(demo2.offsetWidth-demo.scrollLeft <=0)


demo.scrollLeft-=demo1.offsetWidth




else...{


demo.scrollLeft++


}


}


var MyMar1=setInterval(Marquee1,Picspeed)




demo.onmouseover=function() ...{clearInterval(MyMar1)}




demo.onmouseout=function() ...{MyMar1=setInterval(Marquee1,Picspeed)}


</script>


</form>




<%...@ Control Language= "C# " AutoEventWireup= "true " CodeFile= "News.ascx.cs " Inherits= "UserAscx_News " %>




<%...@ Register Assembly= "AjaxControlToolkit " Namespace= "AjaxControlToolkit " TagPrefix= "cc1 " %>


<table border= "0 " cellpadding= "3 " cellspacing= "0 ">


<tr>


<td valign= "top ">


<asp:Image ID= "imgNews " runat= "server " Height= "120px " Width= "160px " />  


<cc1:SlideShowExtender ID= "SlideShowExtender1 " runat= "server " TargetControlID= "imgNews "


AutoPlay= "true " Enabled= "true " Loop= "true " SlideShowServicePath= "NewPictures.asmx "


SlideShowServiceMethod= "GetSlides ">


</cc1:SlideShowExtender>


</td>


<td valign= "top ">


<asp:DataList ID= "dlNews " runat= "server " OnItemDataBound= "dlNews_ItemDataBound ">


<ItemTemplate>


<asp:HyperLink ID= "hlNews " runat= "server " Target= "_blank "> </asp:HyperLink>


</ItemTemplate>


<AlternatingItemStyle CssClass= "tr2 " Font-Size= "12px " HorizontalAlign= "Left " />


<ItemStyle CssClass= "tr1 " Font-Size= "12px " HorizontalAlign= "Left " />


</asp:DataList>


<asp:HyperLink ID= "hlMore " runat= "server " Font-Size= "12px " Target= "_blank "> 更多新闻... </asp:HyperLink> </td>


</tr>


<tr>


<td colspan= "2 " valign= "top ">


<asp:Panel runat= "server " ID= "plScroll " BackColor= "white ">


<marquee direction= "left " id= "mq " name= "mq " scrollamount= "5 " behavior= "scroll " scrolldelay= '100 '> <asp:Repeater id= "rpNews " runat= "server " OnItemDataBound= "rpNews_ItemDataBound ">


<ItemTemplate>


<nowrap>


<asp:HyperLink ID= "hlView " runat= "server " Target= "_blank " Font-Size= "12px "> [hlView] </asp:HyperLink>


 


</nowrap>


</ItemTemplate>


</asp:Repeater> </marquee>


</asp:Panel>


</td>


</tr>


</table>




两种,任选其一