blocks|key|569|text|我以前找到了这个解决方案，如果你还没有找到解决方案的话，这个解决方案可能对你有用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|570|对我来说，问题在于CSS3转换，而adding+useCSS:+false强迫me滑块使用jQuery来代替CSS。|offset|length|style|CODE|571|++++<script+type="text/javascript">
++++++$(document).ready(function(){+
+++++++++$('.bxslider').bxSlider({

+++++++++++++auto:+true,
+++++++++++++autoControls:+false,
+++++++++++++controls:+false,
+++++++++++++pause:+4000,
+++++++++++++infiniteLoop:+true,
+++++++++++++mode:+'horizontal',
+++++++++++++autoDirection:+'next',
+++++++++++++responsive:+true,
+++++++++++++preloadImages:+'all',
+++++++++++++minSlides:+2,
+++++++++++++autoDelay:+0,
+++++++++++++randomStart:+false,
+++++++++++++pager:+false,
+++++++++++++moveSlideQty:+1,
useCSS:+false,

+++++++++++});
+++++++++});
+++++++</script>++|code-block|syntax|javascript|572|entityMap^0|0|H|K|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@$D|Q|E|R|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|S|8|@]|9|@]|A|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>I found this solution previously that may work for you if you have not yet found a solution. </p>

<p>For me the problem was the CSS3 transitions and <code>adding useCSS: false</code> forces bxslider to use jQuery for the transitions instead of CSS.</p>

<pre><code>    &lt;script type="text/javascript"&gt;
      $(document).ready(function(){ 
         $('.bxslider').bxSlider({

             auto: true,
             autoControls: false,
             controls: false,
             pause: 4000,
             infiniteLoop: true,
             mode: 'horizontal',
             autoDirection: 'next',
             responsive: true,
             preloadImages: 'all',
             minSlides: 2,
             autoDelay: 0,
             randomStart: false,
             pager: false,
             moveSlideQty: 1,
useCSS: false,

           });
         });
       &lt;/script&gt;  
</code></pre>


blocks|key|2443440|text|我也有过类似的问题。对我来说，问题在于我无意中在组成bxslider幻灯片的html元素中添加了一个bx克隆类。当应用于一组HTML元素时，so滑块会添加这个类，因此手动这样做一定会干扰到一些事情。当我移除这个类属性时，从最后一张幻灯片到第一张幻灯片的转换很好(即顺利地继续向右移动，而不是快速地在所有幻灯片中向左滚动)。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2443441|破译代码：|2443442|<body>

++++<script>

++++++++$(document).ready(function(){
++++++++++++$('.bxslider').bxSlider({
++++++++++++++++infiniteLoop:+true,
++++++++++++++++minSlides:+1,
++++++++++++++++maxSlides:+1,
++++++++++++++++pager:+false,
++++++++++++++++slideWidth:+320,
++++++++++++++++touchEnabled:true
++++++++++++});
++++++++});

++++</script>

<ul+class="bxslider">
++<li+class="bx-clone"><img+src="images/tree_root.jpg"+title="Funky+roots"+/></li>
++<li+class="bx-clone"><img+src="images/hill_road.jpg"+title="The+long+and+winding+road"+/></li>
++<li+class="bx-clone"><img+src="images/trees.jpg"+title="Happy+trees"+/></li>
</ul>

</body>|code-block|syntax|javascript|2443443|固定代码：|2443444|<body>

++++<script>

++++++++$(document).ready(function(){
++++++++++++$('.bxslider').bxSlider({
++++++++++++++++infiniteLoop:+true,
++++++++++++++++minSlides:+1,
++++++++++++++++maxSlides:+1,
++++++++++++++++pager:+false,
++++++++++++++++slideWidth:+320,
++++++++++++++++touchEnabled:true
++++++++++++});
++++++++});

++++</script>

<ul+class="bxslider">
++<li><img+src="images/tree_root.jpg"+title="Funky+roots"+/></li>
++<li><img+src="images/hill_road.jpg"+title="The+long+and+winding+road"+/></li>
++<li><img+src="images/trees.jpg"+title="Happy+trees"+/></li>
</ul>

</body>|2443445|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>I had a similar issue.  For me, the problem was that I had inadvertently added a class of bx-clone to the html elements that make up bxslider's slides.  Bxslider adds this class when applied to a set of HTML elements so doing this manually must have interfered with things.  When I removed this class attribute then the transitioning from last slide to first was fine (i.e. smoothly continuing to the right rather than scrolling quickly left through all slides).</p>

<p>broken code:</p>

<pre><code>&lt;body&gt;

    &lt;script&gt;

        $(document).ready(function(){
            $('.bxslider').bxSlider({
                infiniteLoop: true,
                minSlides: 1,
                maxSlides: 1,
                pager: false,
                slideWidth: 320,
                touchEnabled:true
            });
        });

    &lt;/script&gt;

&lt;ul class="bxslider"&gt;
  &lt;li class="bx-clone"&gt;&lt;img src="images/tree_root.jpg" title="Funky roots" /&gt;&lt;/li&gt;
  &lt;li class="bx-clone"&gt;&lt;img src="images/hill_road.jpg" title="The long and winding road" /&gt;&lt;/li&gt;
  &lt;li class="bx-clone"&gt;&lt;img src="images/trees.jpg" title="Happy trees" /&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;/body&gt;
</code></pre>

<p>fixed code:</p>

<pre><code>&lt;body&gt;

    &lt;script&gt;

        $(document).ready(function(){
            $('.bxslider').bxSlider({
                infiniteLoop: true,
                minSlides: 1,
                maxSlides: 1,
                pager: false,
                slideWidth: 320,
                touchEnabled:true
            });
        });

    &lt;/script&gt;

&lt;ul class="bxslider"&gt;
  &lt;li&gt;&lt;img src="images/tree_root.jpg" title="Funky roots" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/hill_road.jpg" title="The long and winding road" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/trees.jpg" title="Happy trees" /&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;/body&gt;
</code></pre>


blocks|key|517|text|这就是我终于成功的原因。这花了我很长时间才算出来，但是值的单引号，沿着上面列出的其他答案，修正了回滚到第一个幻灯片问题。现在，它顺利地过渡到第一阶段。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|518|++++<script+type="text/javascript">
+++++++$(document).ready(function(){
+++++++$('.bxslider').bxSlider({
+++++++++++pager:+'false',
+++++++++++mode:+'horizontal',
+++++++++++auto:+'true',
+++++++++++speed:++'900',
+++++++++++pause:++'6000',
+++++++++++controls:+'false',
+++++++++++slideMargin:+'20',
+++++++++++slideWidth:++'940',
+++++++++++infiniteLoop:+'true',
+++++++++++maxSlides:+'1',
+++++++++++moveSlides:+'1',
+++++++++++moveSlideQty:+'1',
+++++++++++useCSS:+'false',

++++++++});
++++++++});
++++</script>|code-block|syntax|javascript|519|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>This is what finally worked for me. This took me ages to work it out but the single quotes for the values, along the other answers listed above, fixed the roll back to first slide issue. It now smoothly transitions to the first.</p>

<pre><code>    &lt;script type="text/javascript"&gt;
       $(document).ready(function(){
       $('.bxslider').bxSlider({
           pager: 'false',
           mode: 'horizontal',
           auto: 'true',
           speed:  '900',
           pause:  '6000',
           controls: 'false',
           slideMargin: '20',
           slideWidth:  '940',
           infiniteLoop: 'true',
           maxSlides: '1',
           moveSlides: '1',
           moveSlideQty: '1',
           useCSS: 'false',

        });
        });
    &lt;/script&gt;
</code></pre>


blocks|key|1901931|text|当我将minSlides设置为1时，我似乎就会出现这种情况。其他任何解决方案都不适合我，但将minSlides更改为1以上会阻止问题的发生。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1901932|进一步来看，在GitHub上出现了一个问题，将其标记出来--在插件中为容器宽度内置了一个垫子，但这个缓冲不够大：https://github.com/stevenwanderski/bxslider-4/issues/467|offset|length|1901933|有一个简单的修复程序正在等待合并：https://github.com/stevenwanderski/bxslider-4/pull/468/files|1901934|我试过了，而且对我有用。|1901935|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/stevenwanderski/bxslider-4/issues/467|1|https://github.com/stevenwanderski/bxslider-4/pull/468/files^0|0|1K|1K|0|0|H|1O|1|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|U|8|@]|9|@$D|V|E|W|1|X]]|A|$]]|$1|F|3|G|5|6|7|Y|8|@]|9|@$D|Z|E|10|1|11]]|A|$]]|$1|H|3|I|5|6|7|12|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|K|$L|$5|M|N|O|A|$P|Q]]|R|$5|M|N|O|A|$P|S]]]]

<p>This seems to occur for me when I set minSlides to 1. None of the other solutions worked for me, but changing minSlides to more than 1 stops the issue from occuring.</p>

<p>Looking into this further, there's an issue raised on GitHub that flags this up - there's a cushion built into the plugin for the container width that isn't large enough:
<a href="https://github.com/stevenwanderski/bxslider-4/issues/467" rel="nofollow">https://github.com/stevenwanderski/bxslider-4/issues/467</a></p>

<p>There's a simple fix committed waiting to be merged:
<a href="https://github.com/stevenwanderski/bxslider-4/pull/468/files" rel="nofollow">https://github.com/stevenwanderski/bxslider-4/pull/468/files</a></p>

<p>I've tried it, and it worked for me.</p>


blocks|key|2443525|text|似乎of滑块有时错误地计算包装ul容器的宽度。这迫使结束的bxclone不能呈现到最后一个元素的右侧。不管如何，我都不能让它删除内联边距-对吧，它添加到了内部li元素中，不过很简单：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2443526|.bxslider{
@include+respond-to-max(phones)+{
++++++++margin-right:+2px+!important;
++++}
}|code-block|syntax|javascript|2443527|帮我解决了。|2443528|以上是对|2443529|$('#section-from-store-slider').bxSlider({+
++++mode:+'horizontal',
++++captions:+false,
++++adaptiveHeight:+true,
++++prevText:+'',
++++nextText:+'',
++++slideMargin:+0,
++++autoReload:+true,
++++infiniteLoop:+true,
++++breaks:+[{+screen:+0,+slides:+1+},+{+screen:+768,+slides:+3+},+{+screen:+1024,+slides:+4+}]
});|2443530|现在我使用了2px，因为5px滑块将它设置为5+5px，这使得它变得很宽，这取决于格式、3px或4px，甚至可能是0为您解决它。|2443531|我知道这是个“丑陋”的错误，我们不喜欢！很重要。但这是注入内联风格所以。|2443532|下面是简单的、没有响应性的css：|2443533|#yourslider.bxslider+li{
++++margin-right:0+important!;
}|2443534|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Y|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|Z|8|@]|9|@]|A|$]]|$1|K|3|L|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|M|3|N|5|6|7|11|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|12|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|13|8|@]|9|@]|A|$]]|$1|S|3|T|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|U|3|-4|5|6|7|15|8|@]|9|@]|A|$]]]|V|$]]

<p>Seems like Bxslider sometimes miscalculates the width of the wrapping ul container. This forces the ending bxclone to not render to the right of the last element. No matter how I couldn't get it to remove the inline margin-right it added to the inner li elements however a simple:</p>

<pre><code>.bxslider{
@include respond-to-max(phones) {
        margin-right: 2px !important;
    }
}
</code></pre>

<p>solved it for me.</p>

<p>Above is a fix for </p>

<pre><code>$('#section-from-store-slider').bxSlider({ 
    mode: 'horizontal',
    captions: false,
    adaptiveHeight: true,
    prevText: '',
    nextText: '',
    slideMargin: 0,
    autoReload: true,
    infiniteLoop: true,
    breaks: [{ screen: 0, slides: 1 }, { screen: 768, slides: 3 }, { screen: 1024, slides: 4 }]
});
</code></pre>

<p>Now I used 2px since bxslider set it to 5px which made it to wide, depending on format, 3px or 4px or perhaps even 0 solves it for you.</p>

<p>I know this is classified as an "ugly" bug, we don't like !important. But this is injected inline style so.</p>

<p>Below would be the simple non sass, non responsive css:</p>

<pre><code>#yourslider.bxslider li{
    margin-right:0 important!;
}
</code></pre>


blocks|key|2443563|text|如果您正在使用Wordpress并在侧栏中使用滑块，那么问题似乎是slideMargin选项(>0)正在阻止图像有序。以下是我所使用的设置：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2443564|<script+type="text/javascript">
jQuery(window).load(function()+{
++++jQuery('.testimonials-slider').bxSlider({
++++++++++++minSlides:+1,
++++++++++++maxSlides:+1,
++++++++++++slideMargin:+0,
++++++++++++infiniteLoop:true,
++++++++++++autoReload:true,
++++++++++++auto:+<?php+echo+isset($data['auto'])+?+$data['auto']+:+"true";?>,
++++++++++++pager:<?php+echo+isset($data['pager'])+?+$data['pager']+:+"true";?>,++++++++++++++++
++++++++++++adaptiveHeight:true,
++++++++++++controls:<?php+echo+isset($data['controls'])+?+$data['controls']+:+"true";?>,
++++++++++++autoControls:+false,
++++++++++++speed:<?php+echo+((isset($data['speed']))+and+(!empty($data['speed'])))+?+$data['speed']+:+"500";?>,
++++++++++++mode:'<?php+echo+isset($data['mode'])+?+$data['mode']+:+"horizontal";?>',
++++++++++++randomStart:<?php+echo+isset($data['randomstart'])+?+$data['randomstart']+:+"false";?>,
++++++++++++pause:+<?php+echo+((isset($data['pause']))+and+(!empty($data['pause'])))+?+$data['pause']+:+"5000";?>
++++});
});
</script>|code-block|syntax|javascript|2443565|只需忽略PHP设置即可。主要是设置slideMargin:+0，Infinite循环:true，autoReload:true，|2443566|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>If you are using Wordpress and have your slider in the sidebar then the issue appears to be that the slideMargin option (>0) is stopping the images from being in order. These are the settings I have used:</p>

<pre><code>&lt;script type="text/javascript"&gt;
jQuery(window).load(function() {
    jQuery('.testimonials-slider').bxSlider({
            minSlides: 1,
            maxSlides: 1,
            slideMargin: 0,
            infiniteLoop:true,
            autoReload:true,
            auto: &lt;?php echo isset($data['auto']) ? $data['auto'] : "true";?&gt;,
            pager:&lt;?php echo isset($data['pager']) ? $data['pager'] : "true";?&gt;,                
            adaptiveHeight:true,
            controls:&lt;?php echo isset($data['controls']) ? $data['controls'] : "true";?&gt;,
            autoControls: false,
            speed:&lt;?php echo ((isset($data['speed'])) and (!empty($data['speed']))) ? $data['speed'] : "500";?&gt;,
            mode:'&lt;?php echo isset($data['mode']) ? $data['mode'] : "horizontal";?&gt;',
            randomStart:&lt;?php echo isset($data['randomstart']) ? $data['randomstart'] : "false";?&gt;,
            pause: &lt;?php echo ((isset($data['pause'])) and (!empty($data['pause']))) ? $data['pause'] : "5000";?&gt;
    });
});
&lt;/script&gt;
</code></pre>

<p>Just ignore the PHP settings. The main thing is to set slideMargin: 0, infiniteLoop:true, autoReload:true,</p>


blocks|key|657|text|这似乎很愚蠢，我一直在努力解决这个问题，当我的另一个开发人员意识到我们两次调用be滑块函数时--一次是从插件中调用的，另一次是手动调用的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|658|在铬上，点击Ctrl+%2B+U，快速搜索On滑块。如果你看到它两次，从课程代码中删除，你应该是好的。|659|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

<p>This may seem to be stupid and I was struggling with this problem a lot, when one of my other developers realized that we were calling the bxslider function twice - once from the plugin and other, manually.</p>

<p>On chrome, hit Ctrl + U, and do a quick search for bxslider. If you see it twice, remove from the course code and you should be good. </p>


blocks|key|1902021|text|我的问题略有不同，但这可能会对某人有所帮助。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1902022|我用的是一个滑块。假设我有四张幻灯片在旋转木马上自动旋转。我从第一张幻灯片开始的代码设置为从第一张幻灯片开始，在最后一张幻灯片上停止。我想让它不断地旋转或执行一个“无限循环”。当我在jquery.bxslider.js中将无限循环设置为true时，滑块将显示幻灯片1和2，当滑块达到3时，它会压缩并显示幻灯片1，然后显示4，然后重新开始。当然，这会导致我想在幻灯片3上显示的内容出现问题。我的代码在下面，以及我做了什么来修复它。|1902023|<script+src="common/js/jquery.bxslider.js"></script>
<link+href="common/css/jquery.bxslider.css"+rel="stylesheet"+/>
<script+type="text/javascript">
$(document).ready(function(){


$('.slider1').bxSlider({
mode:+'horizontal',
slideWidth:+940,
minSlides:+1,
maxSlides:+9,
slideMargin:+20,
controls:+true


+});
});
</script>



<div+id="carousel">


<div+class="slider1">
++++++++<div+class="slide">[STUFFHERE]</div>
++++++++<div+class="slide">[STUFFHERE]</div>
++++++++<div+class="slide">[STUFFHERE]</div>
++++++++<div+class="slide">[STUFFHERE]</div>
++++++++</div>
++++++++</div>|code-block|syntax|javascript|1902024|更改jquery.bxslider.js中的设置，使无限循环成为真|1902025|//+GENERAL
++++mode:+'horizontal',
++++slideSelector:+'',
++++infiniteLoop:+true,
++++hideControlOnEnd:+false,
++++speed:+500,
++++easing:+'ease',
++++slideMargin:+0,
++++startSlide:+0,
++++randomStart:+false,
++++captions:+false,
++++ticker:+false,
++++tickerHover:+false,
++++adaptiveHeight:+false,
++++adaptiveHeightSpeed:+500,
++++video:+false,
++++useCSS:+true,
++++preloadImages:+'all',
++++responsive:+true,+|1902026|要修复它，我必须做的是更改min/max幻灯片值。不管它们的默认值是什么，它们都不允许Infinite循环设置正常工作。这可能需要一些实验，取决于您自己对滑块的需求，但这正是解决我的问题的方法。|1902027|$(document).ready(function(){


$('.slider1').bxSlider({


+mode:+'horizontal',


slideWidth:+940,
minSlides:++to+0,

maxSlides:++to+1,

slideMargin:+20,


controls:+true|1902028|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|V|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

<p>My issue was slightly different, but this may help someone. </p>

<p>I was working with a boxslider.  Lets say I have had four slides automatically rotating on the carousel.  The code that I started with was set to start at the 1st slide, and stop at the last.  I wanted it to continuously rotate or perform an "infiniteloop". When I set the infinite loop to true in jquery.bxslider.js, the slider would display slides 1 and 2, and when it got to 3, it would zip through it and display slide 1, then 4, and then it would start over again.  This of course causes an issue for content that I want to display on slide 3.  My code is below, and what I did to fix it.    </p>

<pre><code>&lt;script src="common/js/jquery.bxslider.js"&gt;&lt;/script&gt;
&lt;link href="common/css/jquery.bxslider.css" rel="stylesheet" /&gt;
&lt;script type="text/javascript"&gt;
$(document).ready(function(){


$('.slider1').bxSlider({
mode: 'horizontal',
slideWidth: 940,
minSlides: 1,
maxSlides: 9,
slideMargin: 20,
controls: true


 });
});
&lt;/script&gt;



&lt;div id="carousel"&gt;


&lt;div class="slider1"&gt;
        &lt;div class="slide"&gt;[STUFFHERE]&lt;/div&gt;
        &lt;div class="slide"&gt;[STUFFHERE]&lt;/div&gt;
        &lt;div class="slide"&gt;[STUFFHERE]&lt;/div&gt;
        &lt;div class="slide"&gt;[STUFFHERE]&lt;/div&gt;
        &lt;/div&gt;
        &lt;/div&gt;
</code></pre>

<p>Changing the settings in jquery.bxslider.js  so that infinite loop is true</p>

<pre><code>// GENERAL
    mode: 'horizontal',
    slideSelector: '',
    infiniteLoop: true,
    hideControlOnEnd: false,
    speed: 500,
    easing: 'ease',
    slideMargin: 0,
    startSlide: 0,
    randomStart: false,
    captions: false,
    ticker: false,
    tickerHover: false,
    adaptiveHeight: false,
    adaptiveHeightSpeed: 500,
    video: false,
    useCSS: true,
    preloadImages: 'all',
    responsive: true, 
</code></pre>

<p>What I had to do to fix it was change the min/maxslides values.  Whatever they default values were, they were not allowing the infiniteloop setting to work properly.  It may take some some experimenting depending on your own requirements for the slider, but this is what worked for my problem.  </p>

<pre><code>$(document).ready(function(){


$('.slider1').bxSlider({


 mode: 'horizontal',


slideWidth: 940,
minSlides: &lt;!--from 1--&gt; to 0,

maxSlides: &lt;!--from 9--&gt; to 1,

slideMargin: 20,


controls: true
</code></pre>


<p>I have a quick question with bxslider.</p>

<p>The issue that I'm having is that an infiniteLoop set to true, however, when it gets to the last image it goes left instead of the first slide of the loop.  Here is my code:</p>

<pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){ 
     $('.bxslider').bxSlider({

         auto: true,
         autoControls: false,
         controls: false,
         pause: 4000,
         infiniteLoop: true,
         mode: 'horizontal',
         autoDirection: 'next',
         responsive: true,
         preloadImages: 'all',
         minSlides: 2,
         autoDelay: 0,
         randomStart: false,
         pager: false,
         moveSlideQty: 1

       });
     });
   &lt;/script&gt;    
</code></pre>


bxslider infinite loop scrolls left to first slide instead of right to loop

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我对bxslider滑块有个快速的问题。但是，我遇到的问题是，当infiniteLoop设置为true时，它会向左转，而不是循环的第一张幻灯片。这是我的代码：<script type="text/javascript">  $(document).ready(function(){      $('.bxslider'...

问to滑块无限循环滚动左到第一幻灯片，而不是右到循环。
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问to滑块无限循环滚动左到第一幻灯片，而不是右到循环。EN