ASP.NET中利用DataList实现图片无缝滚动
Ranran
·
2015-06-08
·
via 博客园 - Ranran
这个问题之前也困扰我，后来解决了，拿出来分享下，以后用也方便，代码很容易看懂，不多说什么了
- <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>
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。
