我有这个JavaScript轮播,当用户到达图库的开头或结尾时,我不知道如何隐藏箭头(上一个和下一个)。如果有人可以帮助我添加必要的脚本来隐藏这些箭头,我将不胜感激。
这是HTML的一部分
<!--CAROUSEL-->
<div id="content" class="content" >
<div class="item">
<div class="thumb_wrapper">
<div class="thumb">
<ul>
<li><img src="img350/albatarrec00.jpg" /></li>
<li><img src="img350/albatarrec01.jpg" /></li>
</ul>
</div>
<a class="prev" href="#"></a> <a class="next" href="#"></a> </div>
</div>
</div>
<!--end CAROUSEL-->
相关脚本
$thumb_list.each(function(){
var $this_list = $(this),
total_w = 0,
loaded = 0,
//preload all the images first
$images = $this_list.find('img'),
total_images= $images.length;
$images.each(function(){
var $img = $(this);
$('<img/>').load(function(){
++loaded;
if (loaded == total_images){
$this_list.data('current',0).children().each(function(){
total_w += $(this).width();
});
$this_list.css('width', total_w + 'px');
//next / prev events
$this_list.parent()
.siblings('.next')
.bind('click',function(e){
var current = $this_list.data('current');
if(current == $this_list.children().length -1) return false;
var next = ++current,
ml = -next * $this_list.children(':first').width();
$this_list.data('current',next)
.stop()
.animate({
'marginLeft' : ml + 'px'
},400);
e.preventDefault();
})
.end()
.siblings('.prev')
.bind('click',function(e){
var current = $this_list.data('current');
if(current == 0) return false;
var prev = --current,
ml = -prev * $this_list.children(':first').width();
$this_list.data('current',prev)
.stop()
.animate({
'marginLeft' : ml + 'px'
},400);
e.preventDefault();
});
}
}).attr('src',$img.attr('src'));
});
});
});
谢谢您的帮助