1

我目前正在用 bxslider 构建一个滑块。我认为一切正常,直到我需要向当前幻灯片添加一个活动类。我得到了这个工作正常,但在我的源代码中,我注意到幻灯片被复制了两次,如果不是 3 次。我的滑块中只有 3 张幻灯片。我已将 displaySlideQty 设置为 3 并将 moveSlideQty 设置为 1。

问题是正在添加活动类,但没有从重复的幻灯片中删除。下面是我的 bxslider 的 jquery 代码:

    $(document).ready(function(){
  var slider = $('#slider1').bxSlider({
    controls: false,
    displaySlideQty: 3,
    moveSlideQty: 1,

    onBeforeSlide: function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject){
        $('.pager').removeClass('active-slide');   
         $(currentSlideHtmlObject).next().addClass('active-slide');
 //     $('#sddf').html('<p class="check">Slide index ' + currentSlide + ' of ' + totalSlides + ' total slides has completed.');

    }

这是我的html:

<ul id="slider1" style="overflow:hidden; margin:auto;">
     <li id="slidel" style="width:960px;">
      <?php include('includes/sliders/center.php'); ?>
    </li>

    <li id="slidec" style="width:960px;">
      <?php include('includes/sliders/left.php'); ?>
    </li>
    <li id="slider" style="width:960px;">
      <?php include('includes/sliders/right.php'); ?>
    </div>
  </ul>

这是萤火虫的输出:

<ul id="slider1" style="overflow: hidden; margin: auto; width: 999999px; position: relative; left: -960px;">
<li id="slider" style="width: 960px; float: left; list-style: none outside none;">
<li id="slidel" class="pager" style="width: 960px; float: left; list-style: none outside none;">
<li id="slidec" class="pager active-slide" style="width: 960px; float: left; list-style: none outside none;">
<li id="slider" class="pager" style="width: 960px; float: left; list-style: none outside none;">
<li id="slidel" style="width: 960px; float: left; list-style: none outside none;" class="active-slide">
<li id="slidec" style="width: 960px; float: left; list-style: none outside none;">
<li id="slider" style="width: 960px; float: left; list-style: none outside none;">
</ul>

请注意上面有 2 个活动课程。底部的不会改变。

iv 花了将近一天的时间,却一无所获!任何帮助将不胜感激

干杯,丹

4

0 回答 0