0

我正在为 jQuery 图像滑块使用一些代码，我发现它可以在 wordpress(pods) 中使用自定义帖子类型。滑块运行良好，但我需要根据有多少图像来限制用户可以滚动到下一张图像的次数。

<script type="text/javascript">   
$(function() {
$("img.enlarge").live('click', function (e) {
   e.preventDefault();
   var src = this.src;
   $("#fullImage").attr("src", src);
});
});

$(document).ready(function() {

$('img').filter(function(index){return $(this).attr('src')==='';}).removeClass('enlarge');
$('img').filter(function(index){return $(this).attr('src')==='';}).hide(); 

var $item = $('img.enlarge'), //Cache your DOM selector
    visible = 1, //Set the number of items that will be visible
    index = 0, //Starting index
    endIndex = ( $item.length / visible ) ; //End index (NOTE:: Requires visible to be a factor of $item.length... You can improve this by rounding...)

    $('div#arrowR').click(function(){
        if(index < endIndex ){
          index++;
          $item.animate({'left':'-=275px'});
      }
  });

    $('div#arrowL').click(function(){
        if(index > 0){
          index--;            
          $item.animate({'left':'+=275px'});
      }
  });

});
</script>

<div class="detail-slider-thumbs" id="detail-images">
 <img class="enlarge" src="{@main_image}"/>
 <img class="enlarge" src="{@image_2}"/>
 <img class="enlarge" src="{@image_3}"/>
 <img class="enlarge" src="{@image_4}"/>
 <img class="enlarge" src="{@image_5}"/>
</div>

因此，如果用户只上传 4 张图片，我需要代码来动态响应该数字，而不是像当前那样滚动到空白图片点。

4

0 回答 0