服务器之家

服务器之家 > 正文

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

时间:2019-11-10 11:57     来源/作者:asp.net教程网

[html]

复制代码代码如下:


<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.zzvips.com
        var MyMar = setInterval(Marquee, speed) 
        demo.onmouseover = function () { clearInterval(MyMar) } 
        demo.onmouseout = function () { MyMar = setInterval(Marquee, speed) }  
    </script> 

相关文章

热门资讯

玄元剑仙肉身有什么用 玄元剑仙肉身境界等级划分
玄元剑仙肉身有什么用 玄元剑仙肉身境界等级划分 2019-06-21
男生常说24816是什么意思?女生说13579是什么意思?
男生常说24816是什么意思?女生说13579是什么意思? 2019-09-17
华为nova5pro和p30pro哪个好 华为nova5pro和华为p30pro对比详情
华为nova5pro和p30pro哪个好 华为nova5pro和华为p30pro对比详情 2019-06-22
Nginx服务器究竟是怎么执行PHP项目
Nginx服务器究竟是怎么执行PHP项目 2019-05-24
配置IIS网站web服务器的安全策略配置解决方案
配置IIS网站web服务器的安全策略配置解决方案 2019-05-23
返回顶部