Question

jq.carousel是否支持动态添加的图片？我有'一些'按钮，o 我有一个按钮，点击它后，通过Ajax加载图像数组并将它们传递给滑块。

var seplen=separatedLeft.length;   //images array
var carus = $('#carousel');        //will append images to this element
var imglist='';                    //we use this variable for optimization..
for(var i=0;i<seplen;i++){
    imglist+='<div class="carousel_box"><img src="content/'+separatedLeft[i]+'" alt="img" style="width:350px;height:450px;" /></div>';    //add all images what we have (actually there 2 or 3 images)
    }

carus.html(imglist);

所以..图像成功添加到滑块，我可以看到至少源中的第一个图像一切正常与HTML，但按钮左和右（滑动图像）不起作用，也许有人知道为什么？

滑块

的部分

<div class="carousel">
    <div id="carousel" class="carousel_inner">
                       //images will be here
    </div>

    <p class="btns">
        <input type="button" id="carousel_prev" value="prev">
        <input type="button" id="carousel_next" value="next">
    </p>
</div>


<style type="text/css">
#carousel{
  margin: 0 auto;
  width: 350px;
  height: 450px;
  overflow: hidden;
}
#carousel .carousel_box{
  width: 350px;
  height: 450px;
  color: #fff;
  background: #252525;
  line-height: 450px;
  text-align: center;
  font-size: 123%;
}
#carousel .carousel_box.second{
background: #666;
}
#carousel .carousel_box.third{
  background: #999;
}

</style>

<script type="text/javascript">
var $carousel = $('#carousel').carousel({
 easing:'swing',
 duration: 0.2 // move duration
});

$('#carousel_prev').live('click', function(ev) {
  $carousel.carousel('prev');
});
$('#carousel_next').live('click', function(ev) {
  $carousel.carousel('next');
});
</script>

Answer 1

根据您链接的网站，您可以使用重置和刷新命令，并将内容添加到轮播中。您可以在页面here上看到一个示例。

jq.carousel是否支持动态添加图像？

1 个答案: