有些图像在easy js滑块中重复出现

Question

您好我正在使用easy 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;
}