jQuery 轮播新样式 下一个和上一个 在第一张和最后一张幻灯片上

Question

我对jQuery很陌生，我使用这个jQuery轮播。我不想使用任何插件。但是我想问一下，当我在第一张幻灯片上时，我如何用另一种样式/颜色制作上一个按钮，当我在第一张幻灯片上时，我怎样才能用另一种样式/颜色制作下一个按钮。

这是演示

http://jsfiddle.net/rGLsG/24/

这里是jQuery代码

      $(function(){
     var carousel = $('.carousel ul');
       var carouselChild = carousel.find('li');
      var clickCount = 0;
     var canClick = true;
     itemWidth = carousel.find('li:first').width()+1; //Including margin

     carousel.width(itemWidth*carouselChild.length);

        refreshChildPosition();

        $('.btnNext').click(function(e){        
if($(".carousel").find("li:eq(6)").text()!=14) {
    if(canClick) {
        canClick = false;
        clickCount++;
        //Animate the slider to left as item width 
        carousel.stop(false, true).animate({
            left : '-='+itemWidth
        },300, function(){
            //Find the first item and append it as the last item.
            lastItem = carousel.find('li:first');
            lastItem.remove().appendTo(carousel);
            lastItem.css('left', ((carouselChild.length-1)*(itemWidth))+(clickCount*itemWidth));
            canClick = true;
        });
    }
}

}）;

         $('.btnPrevious').click(function(){
  if($(".carousel").find("li:eq(0)").text()!=1) {
    if(canClick){
        canClick = false;
        clickCount--;
        //Find the first item and append it as the last item.
        lastItem = carousel.find('li:last');
        lastItem.remove().prependTo(carousel);
        lastItem.css('left', itemWidth*clickCount);             
        //Animate the slider to right as item width 
        carousel.finish(true).animate({
            left: '+='+itemWidth
        },300, function(){
            canClick = true;
        });
    }
}
 });
       function refreshChildPosition(){
carouselChild.each(function(){
    $(this).css('left', itemWidth*carouselChild.index($(this)));
});

}

Answer 1

试试这个"对于上一个"按钮

var check = $(".carousel ul").position().left;
        if (check == 0)
        {
             $(".btnPrevious").css('color','red');  
        }

下一个的类似条件

 var cwidth = $(".carousel").width();
    var check = $(".carousel ul").position().left;
    if (check == -cwidth )
                {
                     $(".btnnext").css('color','red');  
                }