1

您好,我正在使用简单的 js 滑块进行图像滑动。我想每张幻灯片显示 3 张图片。这是我的js代码

 <?php
 $slide = true;
 $noOfItems = 3;
  //count($this->statSummary['top_products_data'] is having 5
 if (count($this->statSummary['top_products_data']) <= $noOfItems) {
   $slide = false;
 }
 ?>
$(document).ready(function(){   
    $("#slider").easySlider({
        hoverStop:false,
        auto: false,
        hoverStop:false,
        continuous: false,
        controlsFade:true,
       <?php if ($slide) { ?>
            controlsShow: true,
       <?php } else { ?>
            controlsShow: false,
       <?php } ?>
        verticalHeight: 150
    });

});

现在发生了什么,它显示了三张带有下一个箭头的图片,当我单击下一个按钮时,一个图像幻灯片和其他图像出现,它还显示上一个按钮。但它再次显示前 2 张图像(重复这些图像),然后下一个箭头消失。我不知道为什么会这样。谁能告诉我如何停止前两张图像的重复?

这是我的html

    <li class="rate sliderli">
     <div id="slider">
       <ul>
         <?php
            if (isset($this->statSummary['top_products_data']))
            {
              foreach ($this->statSummary['top_products_data'] as $top_product)
              {
                ?><li><img src="<?php echo $top_product['image_small']; ?>" alt="<?php echo $top_product['product_name']; ?>"/></li><?php
               }
              }
             ?>
           </ul>
        </div>
      </li>

我的 CSS 看起来像

 #slider{
 width: 474px;
 margin:10px auto;
}
#slider li{
width: 150px;
height: 150px;
}
#summaryBox ul li.sliderli{
position: relative;
width: 650px;
}
4

0 回答 0