图片左滚动代码

<DIV id=demoleft style="OVERFLOW: hidden; WIDTH: 700px; COLOR: #ffffff">
<TABLE border=0 cellPadding=0 cellSpacing=0 cellspace="0">
<TBODY>
<TR>
<TD id=demo1left vAlign=top align=middle>
<TABLE cellSpacing=0 cellPadding=2 border=0>
<TBODY>
<TR align=middle>
<TD><img src="images/sysx/tp1.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp2.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp3.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp4.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp5.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp6.jpg" width="100" height="89" /></TD>
<TD><img src="images/sysx/tp7.jpg" width="100" height="89" /></TD>
</TR>
<TR align=middle>
<TD>说明xxxxxxxx</TD>
<TD>说明xxxxxx</TD>
<TD>说明xxxxxxxx</TD>
<TD>说明xxxxxx</TD>
<TD>说明xxxxxx</TD>
<TD>说明xxxxxxx</TD>
<TD>说明xxxxxxx</TD>
</TR>

</TBODY></TABLE></TD>
<TD id=demo2left vAlign=top></TD></TR></TBODY></TABLE></DIV>
<SCRIPT>
var speed=20//速度数值越大速度越慢,demo2.offsetWidth=demo1.offsetWidth=固定值
demo2left.innerHTML=demo1left.innerHTML
function Marquee(){
if(demo2left.offsetWidth-demoleft.scrollLeft<=0)//其实demo.scrollLeft是有 最大值的，和demo0.width,引用的图片的width有关系。demo过了一半（每半内容一样的）

，重新开始循环
demoleft.scrollLeft-=demo1left.offsetWidth
else{
demoleft.scrollLeft++//不断的增加，相当于父容器的滚动条不断是缩小；但由于OVERFLOW: hidden; （滚动条不可见）
}
}
var MyMarleft=setInterval(Marquee,speed)
demoleft.onmouseover=function() {clearInterval(MyMarleft)}
demoleft.onmouseout=function() {MyMarleft=setInterval(Marquee,speed)}
</SCRIPT>

 

我实际的项目中的代码

<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td height="37" background="../images/tp_bg.gif">
            <img alt="" src="../images/tpxw.gif" height="17" /></td>
    </tr>
    <tr>
        <td>
            <table width="90%" border="0" align="center" cellpadding="0" cellspacing="0" class="qbkjb">
                <tr>
                    <td>
                        <div id="demoleft" style="overflow: hidden; width: 197px; color: #ff0000">
                            <table border="0" cellpadding="2" cellspacing="1" cellspace="0">
                                <tbody>
                                    <tr>
                                        <td id="demo1left" valign="top" align="middle">
                                            <table width="150" border="0" align="center" cellpadding="5" cellspacing="3">
                                                <tbody>
                                                    <tr align="middle">
                                                        <asp:Repeater ID="RptImageNews" runat="server">
                                                            <ItemTemplate>
                                                                <td height="120" valign="top">
                                                                    <div align="center">
                                                                        <a href='NewsInfo.aspx?ID=<%#Eval("NewsID") %>' target="_blank">
                                                                            <img alt="" src='../<%#Eval("NewsImage") %>' width="135" height="99" class="qbk3"
                                                                                border="0" /></a></div>
                                                                    <div align="center">
                                                                        <a href='NewsInfo.aspx?ID=<%#Eval("NewsID") %>' target="_blank">
                                                                            <%#Eval("NewsTitle") %>
                                                                        </a>
                                                                    </div>
                                                                </td>
                                                            </ItemTemplate>
                                                        </asp:Repeater>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td id="demo2left" valign="top">
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <script type="text/javascript">
            var speed=20//速度数值越大速度越慢,demo2.offsetWidth=demo1.offsetWidth=固定值
            demo2left.innerHTML=demo1left.innerHTML
            function Marquee(){
            if(demo2left.offsetWidth-demoleft.scrollLeft<=0)//其实demo.scrollLeft是有 最大值的，和demo0.width,引用的图片的width有关系。demo过了一半（每半内容一样的），重新开始循环
            demoleft.scrollLeft-=demo1left.offsetWidth
            else{
            demoleft.scrollLeft++//不断的增加，相当于父容器的滚动条不断是缩小；但由于OVERFLOW: hidden; （滚动条不可见）
            }
            }
            var MyMarleft=setInterval(Marquee,speed)
            demoleft.onmouseover=function() {clearInterval(MyMarleft)}
            demoleft.onmouseout=function() {MyMarleft=setInterval(Marquee,speed)}
                        </script>

                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

.cs文件

YHZB.BLL.tbl_News NewsBLL = new YHZB.BLL.tbl_News();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindData();
        }
    }

    private void BindData()
    {
        RptImageNews.DataSource = NewsBLL.GetList(5, 1, " NewsIsImg=1").Tables[0];
        RptImageNews.DataBind();
    }