ASP.NET中利用DataList实现图片无缝滚动 实例分享

<div id=”demo” style=”overflow: hidden; width: 441px; border: 0px”>

        <table width=”441″ height=”130″ border=”0″ cellpadding=”0″ cellspacing=”0″ background=”Images/img2/32.jpg”>

            <tr>

                <td align=”center” id=”demo1″ valign=”bottom”>

                    <asp:datalist ID=”DataList1″ runat=”server” RepeatDirection=”Horizontal” DataSourceID=”ObjectDataSource1″>

                        <ItemTemplate>

                            <table>

                                <tr>

                                    <td>

                                        <asp:ImageButton ID=”imgbtnInfo” runat=”server” ImageUrl='<%#Eval(“Spic”) %>’ OnClick=”imgbtnInfo_Click”

                                            CommandArgument='<%#Eval(“ID”) %>’ />

                                    </td>

                                </tr>

                                <tr>

                                    <td align=”center”>

                                        <asp:LinkButton ID=”lkbtnInfo” CommandArgument='<%#Eval(“ID”) %>’ runat=”server”

                                            OnClick=”lkbtnInfo_Click” CssClass=”bb” Text='<%#Eval(“Type”) %>’></asp:LinkButton>

                                    </td>

                                </tr>

                            </table>

                        </ItemTemplate>

                    </asp:DataList>

                    <asp:ObjectDataSource ID=”ObjectDataSource1″ runat=”server” SelectMethod=”SelectInfo”

                        TypeName=”HotelDAL.KeFangServices”></asp:ObjectDataSource>

                </td>

                <%– 这一步很重要 –%>

                <td id=”demo2″ align=”center” valign=”bottom”>

                </td>

            </tr>

        </table>

    </div>

    <script>

        //滚动的速度，数值越大速度越慢

        var speed = 20

        demo2.innerHTML = demo1.innerHTML

        //从右至左 

        function Marquee() {

            if (demo1.offsetWidth – demo.scrollLeft <= 0)

                demo.scrollLeft = 0

            else

                demo.scrollLeft++

        }  www.cnhackhy.com

        var MyMar = setInterval(Marquee, speed)

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

        demo.onmouseout = function () { MyMar = setInterval(Marquee, speed) } 

    </script>