基于javascript滚动图片具体实现

 更新时间:2013年11月18日 16:45:04   作者:   我要评论
这篇文章主要介绍了javascript滚动图片具体实现,有需要的朋友可以参考一下

前台:

复制代码 代码如下:

 <div class="block">
            <div class="title">
                <strong>服务展示 </strong>
            </div>
            <div class="content" id="showroom">
                <div class="wrapper index_footer_slide">
                    <div id="index_foot_slide">
                        <div id="in_index_foot_slide">
                            <div id="index_foot_slide1">
                                <asp:Repeater ID="repBottomPictures" runat="server">
                                    <ItemTemplate>
                                        <a href="">
                                            <img src='<%#Eval("ImageUrl")%>' /></a>
                                    </ItemTemplate>
                                </asp:Repeater>
                            </div>
                            <div id="index_foot_slide2">
                                <asp:Repeater ID="Repeater1" runat="server">
                                    <ItemTemplate>
                                        <div>
                                            <a href="">
                                                <img src='<%#Eval("ImageUrl")%>' /></a></div>
                                    </ItemTemplate>
                                </asp:Repeater>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

javascript:

复制代码 代码如下:

    var speed=12; //数字越大速度越慢
    var tab=document.getElementById("index_foot_slide");
    var tab1=document.getElementById("index_foot_slide1");
    var tab2=document.getElementById("index_foot_slide2");
    tab2.innerHTML=tab1.innerHTML;
    function Marquee(){
    if(tab.scrollLeft<=0)
    tab.scrollLeft+=tab2.offsetWidth
    else{
    tab.scrollLeft--
    }
    }
    var MyMar=setInterval(Marquee,speed);
    tab.onmouseover=function() {clearInterval(MyMar)};
    tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};

相关文章

  • JavaScript实现多态和继承的封装操作示例

    JavaScript实现多态和继承的封装操作示例

    这篇文章主要介绍了JavaScript实现多态和继承的封装操作,结合实例形式分析了javascript中多态与继承的实现及封装相关操作技巧,需要的朋友可以参考下
    2018-08-08
  • div层的移动及性能优化

    div层的移动及性能优化

    层的移动本来很简单,用jquery插件或者自己写一个也不难,但是最近一个ipad项目里,发现用手移动div会感觉很卡,体验很差(可能是ipad的配置根不上pc)。
    2010-11-11
  • asp.net刷新本页面的六种方法总结

    asp.net刷新本页面的六种方法总结

    本篇文章主要是对asp.net刷新本页面的六种方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • js时间戳和c#时间戳互转方法(推荐)

    js时间戳和c#时间戳互转方法(推荐)

    下面小编就为大家带来一篇js时间戳和c#时间戳互转方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • js创建对象的方式总结

    js创建对象的方式总结

    这篇文章主要介绍了js创建对象的方式,实例总结了3种常用的创建对象的方式,非常实用,需要的朋友可以参考下
    2015-01-01
  • javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文)

    javascript实现网页子页面遍历回调的方法(涉及 window.frames、

    这篇文章主要介绍了javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文),涉及javascript回调、遍历等实现技巧,需要的朋友可以参考下
    2015-07-07
  • json前后端数据交互相关代码

    json前后端数据交互相关代码

    本篇文章给大家分享了关于json前后端数据交互方法实现的相关知识点内容,有兴趣的读者们可以参考学习下。
    2018-09-09
  • Javascript匿名函数的一种应用 代码封装

    Javascript匿名函数的一种应用 代码封装

    说实话,对于js初学者的我来说。这个东西太吓人了,在这些JS库中,这个函数基本上把整个库的所有代码全括起来了,这种写法完全超越了我的常识。
    2010-06-06
  • javascript attachEvent绑定多个事件执行顺序问题

    javascript attachEvent绑定多个事件执行顺序问题

    执行顺序是没有规律的,但是每次执行的顺序是一样的,如果是随机那么应该每次执行的顺序都不一样才对,这才是我想要说明的
    2010-10-10
  • JavaScript调试技巧之console.log()详解

    JavaScript调试技巧之console.log()详解

    对于JavaScript程序的调试,相比于alert(),使用console.log()是一种更好的方式,原因在于:alert()函数会阻断JavaScript程序的执行,从而造成副作用;而console.log()仅在控制台中打印相关信息,因此不会造成类似的顾虑
    2014-03-03

最新评论