程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> ASP.NET >> 關於ASP.NET >> ASP.NET中利用DataList實現圖片無縫滾動

ASP.NET中利用DataList實現圖片無縫滾動

編輯:關於ASP.NET
    <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++
            }
            var MyMar = setInterval(Marquee, speed)
            demo.onmouseover = function () { clearInterval(MyMar) }
            demo.onmouseout = function () { MyMar = setInterval(Marquee, speed) } 
        </script>
    1. 上一頁:
    2. 下一頁:
    Copyright © 程式師世界 All Rights Reserved