知识 分享 互助 懒人建站

    懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

    懒人建站提供网页素材下载、网站模板
    知识 分享 互助!

    jquery图片无缝滚动js代码ul./li结构,可重用

    作者:佳明妈 来源:jquery 特效 2012-04-16 人气:
    jquery图片无缝滚动js代码ul./li结构,一个页面可重用多个。注意无缝滚动js代码调用中的 $('.marquee').kxbdMarquee({ 这里面的 .marquee 可以换成你的 类名 或者是id名等。

    jquery图片无缝滚动js代码ul./li结构,一个页面可重用多个。注意无缝滚动js代码调用中的  $('.marquee').kxbdMarquee({ 这里面的  .marquee 可以换成你的 类名 或者是id名等。
    图片无缝滚动,鼠标滑过暂停滚动、鼠标滑出继续滚动。可配置向左或者向右滚动。

    html代码结构示例:
    <div class="marquee">
        <ul>
            <li><a href="http://www.51xuediannao.com/js/jquery/"><img src="demo/01.jpg"/><em>jquery 特效</em></a></li>
            <li><a href="http://www.51xuediannao.com/js/gundong/"><img src="demo/02.jpg"/><em>滚动代码</em></a></li>
            <li><a href="http://www.51xuediannao.com/js/nav/"><img src="demo/01.jpg"/><em>导航菜单</em></a></li>
            <li><a href="http://jz.51xuediannao.com/"><img src="demo/02.jpg"/><em>兼职网站大全</em></a></li>
        </ul>
    </div>
    jquery图片无缝滚动,js代码调用示例:
    <script type="text/javascript">
    $(document).ready(function(){
        $('.marquee').kxbdMarquee({
                direction:'left',
                eventA:'mouseenter',
                eventB:'mouseleave'
        });
    });
    </script>
    无缝滚动代码更多参数:
    $.fn.kxbdMarquee.defaults = {
            isEqual:true,//所有滚动的元素长宽是否相等,true,false
            loop: 0,//循环滚动次数,0时无限
            direction: 'left',//滚动方向,'left','right','up','down'
            scrollAmount:1,//步长
            scrollDelay:10,//时长
            newAmount:3,//加速滚动的步长
            eventA:'mousedown',//鼠标事件,加速
            eventB:'mouseup'//鼠标事件,原速
        };

    懒人建站凑字数。^_^ 希望这段jquery无缝滚动代码能帮到你。给你带来方便。

    ↓ 查看全文

    jquery图片无缝滚动js代码ul./li结构,可重用由懒人建站收集整理,您可以自由传播,请主动带上本文链接

    懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

    jquery图片无缝滚动js代码ul./li结构,可重用-最新评论

    • 竹林隐逸者 海南省海口市 2017-10-25 12:05:30
      滚动一会,会出现卡顿一下的情况。后端的不太会弄改前端的东西[/流汗]
    • king 2016-01-19 04:32:39
      IE8 不兼容
    • 11 2016-01-19 04:01:39
      IE8 不兼容
    • 落花有意 2015-10-29 11:21:33
      我发现并没有把8个li里面的元素全部滚动显示出去。仔细观察,li第7,8图片被折叠到下行后,无法滚动显示到窗口里面
    • 11 2015-10-29 11:10:33
      我发现并没有把8个li里面的元素全部滚动显示出去。仔细观察,li第7,8图片被折叠到下行后,无法滚动显示到窗口里面
    • Jquery特效 2015-06-21 11:00:37
      刚才在我的IE11上面切换其他IE版本,发现可以正常运行。暂时没有纯粹的低版本IE测试
    • 11 2015-06-21 11:06:37
      刚才在我的IE11上面切换其他IE版本,发现可以正常运行。暂时没有纯粹的低版本IE测试
    • 11 2015-05-21 02:05:18
      为啥下载下来不能用了
    • 11 2015-03-24 10:03:09
      不兼容IE
    • 11 2015-03-11 02:03:37
      切换ie会出错