Javascript Jquery SimpleScroll在同一页面上滚动多个滚动条
我需要使用Jquery simplyScroll在我的页面上插入几次,就像这里的几个滚动条一样。我正在发布代码,请帮助。我试着用这段代码自己去做,但我无法完成Javascript Jquery SimpleScroll在同一页面上滚动多个滚动条,javascript,jquery,simplyscroll,Javascript,Jquery,Simplyscroll,我需要使用Jquery simplyScroll在我的页面上插入几次,就像这里的几个滚动条一样。我正在发布代码,请帮助。我试着用这段代码自己去做,但我无法完成 <script type="text/javascript" src="./jQuery simplyScroll - Logicbox_files/jquery.min.js"> </script> <!--<script type="text/javascript" src="/js/com
<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({
自动模式:“循环”
});
});
})(jQuery);
谢谢您不能多次使用同一个id。在它不起作用之前 像这样的东西
(function($) {
$(function() {
$("#scroller").simplyScroll({
autoMode: 'loop'
});
$("#scroller1").simplyScroll({
autoMode: 'loop'
});
$("#scroller2").simplyScroll({
autoMode: 'loop'
});
});
})(jQuery);
对于多个滚动条,您可以使用
class
而不是id
。我希望它能帮助你
(function($) {
$(function() {
$(".scroller").simplyScroll({
autoMode: 'loop'
});
});
})(jQuery);
不要使用id和类之类的东西
<ul class="scroller simply-scroll-list" style="width: 2895px; ">....</ul>
<ul class="scroller simply-scroll-list" style="width: 2895px; ">....</ul>
..
…
您不能多次使用同一个id。在它不起作用之前,我们欢迎您,您可以使用类似$(“.scroller”)的类;只有一节课