文章/答案/技术大牛

发布

社区首页 >问答首页 >Jquery simplyScroll同一页面上的多个滚动条

问Jquery simplyScroll同一页面上的多个滚动条
EN

Stack Overflow用户

提问于 2012-01-08 15:03:06

回答 2查看 2.6K关注 0票数 1

我需要在我的页面上使用Jquery simplyScroll插件几次，就像几个滚动条一样，我在这里张贴代码，请帮助。我试着用这段代码自己做到这一点，但我无法完成它。

    <script type="text/javascript" src="./jQuery simplyScroll - Logicbox_files/jquery.min.js">
</script>
<!--<script type="text/javascript" src="/js/common.js"></script>-->
<script type="text/javascript" src="./jQuery simplyScroll - Logicbox_files/jquery.simplyscroll-1.0.4.min.js"></script>
<link rel="stylesheet" href="./jQuery simplyScroll - Logicbox_files/jquery.simplyscroll-1.0.4.css" media="all" type="text/css">
<script type="text/javascript">
(function($) {
    $(function() {
        $("#scroller").simplyScroll({
            autoMode: 'loop'
        });

    });
})(jQuery);
</script>
</head>


<div class="simply-scroll simply-scroll-container"><div class="simply-scroll-back"></div><div class="simply-scroll-forward"></div><div class="simply-scroll-clip">
<ul id="scroller" class="simply-scroll-list" style="width: 2895px; ">
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_9N3H5GYL_tb.jpg" width="290" height="200" alt="Firehouse"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080513_4D3SD1BQ_tb.jpg" width="290" height="200" alt="Chloe nightclub"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080513_VPJWVQRW_tb.jpg" width="290" height="200" alt="Firehouse bar"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080514_B1YJ08B6_tb.jpg" width="290" height="200" alt="Firehouse chloe club fishtank"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080514_JYW68XPT_tb.jpg" width="290" height="200" alt="Firehouse restaurant"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_38CG51J2_tb.jpg" width="290" height="200" alt="Firehouse"></li>
            <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_9N3H5GYL_tb.jpg" width="290" height="200" alt="Firehouse"></li><li><img src="./jQuery simplyScroll - Logicbox_files/20080513_4D3SD1BQ_tb.jpg" width="290" height="200" alt="Chloe nightclub"></li></ul></div></div>

            <div class="simply-scroll simply-scroll-container"><div class="simply-scroll-back"></div><div class="simply-scroll-forward"></div><div class="simply-scroll-clip">
<ul id="scroller" class="simply-scroll-list" style="width: 2895px; ">
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_9N3H5GYL_tb.jpg" width="290" height="200" alt="Firehouse"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080513_4D3SD1BQ_tb.jpg" width="290" height="200" alt="Chloe nightclub"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080513_VPJWVQRW_tb.jpg" width="290" height="200" alt="Firehouse bar"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080514_B1YJ08B6_tb.jpg" width="290" height="200" alt="Firehouse chloe club fishtank"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080514_JYW68XPT_tb.jpg" width="290" height="200" alt="Firehouse restaurant"></li>
                <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_38CG51J2_tb.jpg" width="290" height="200" alt="Firehouse"></li>
            <li><img src="./jQuery simplyScroll - Logicbox_files/20080608_9N3H5GYL_tb.jpg" width="290" height="200" alt="Firehouse"></li><li><img src="./jQuery simplyScroll - Logicbox_files/20080513_4D3SD1BQ_tb.jpg" width="290" height="200" alt="Chloe nightclub"></li></ul></div></div>

谢谢

simplyscroll

javascript

jquery

回答 2

Stack Overflow用户

回答已采纳

发布于 2012-01-08 15:17:48

您不能多次使用同一个id。在它不起作用之前

像这样的东西

(function($) {
    $(function() {
        $("#scroller").simplyScroll({
            autoMode: 'loop'
        });


        $("#scroller1").simplyScroll({
            autoMode: 'loop'
        });


        $("#scroller2").simplyScroll({
            autoMode: 'loop'
        });

    });
})(jQuery);

票数 1

Stack Overflow用户

发布于 2012-08-29 20:12:22

对于多个滚动条，您可以使用class而不是id。我希望它能对你有所帮助。

(function($) {
    $(function() {
        $(".scroller").simplyScroll({
            autoMode: 'loop'
        });
    }); 
})(jQuery);

不要使用id，而要使用class之类的东西

<ul class="scroller simply-scroll-list" style="width: 2895px; ">....</ul>
<ul class="scroller simply-scroll-list" style="width: 2895px; ">....</ul>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/8775933

复制

相似问题

问Jquery simplyScroll同一页面上的多个滚动条
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jquery simplyScroll同一页面上的多个滚动条EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jquery simplyScroll同一页面上的多个滚动条
EN