jquery單圖像滑塊

我需要構建一個圖像滑塊。樓下有一個圖像滑塊的例子，但它不工作的屬性。當我按左鍵滑塊工作正常，但當我點擊右鍵時，它超出了範圍。jquery單圖像滑塊

HTML：

<div class="slider"> 
    <img src="http://lh5.googleusercontent.com/-k__maLyJIPw/UWV1-WyW9rI/AAAAAAAAAJk/MVfNsKPQLsU/s1539/slider.png" alt="" /> 
    <a href="" class="left">left</a> 
    <a href="" class="right">right</a> 
</div>

JAVASCRIPT：

$(document).ready(function() { 
    var SELIDER_OFFSET_LEFT = $(".slider").offset().left; 
    $(".slider .left,.slider .right").click(function(){ 
     var lambda = -1; 
     var isLeft = false; 
     var animateWidth = 100; 
     var isFirst = true; 
     if($(this).hasClass('left')){ 
      lambda = 1; 
      isLeft = true; 
     } 

     var leftOfImg = $(".slider img").offset().left; 
     console.log(leftOfImg); 
     console.log('*'); 
     console.log(SELIDER_OFFSET_LEFT); 

     var leftTTT = (isFirst)?SELIDER_OFFSET_LEFT - animateWidth:SELIDER_OFFSET_LEFT; 
     if(leftOfImg >= leftTTT && isLeft){ 
      return false; 
     }else if(leftOfImg + $(".slider img").width() && !isLeft){ 

     } 

     var isFirst = false; 

     $(".slider img").stop().animate({ 
      marginLeft: '-='+-animateWidth*lambda 
     },1000); 
     return false; 
    }); 

});

這裏是一個演示：http://jsfiddle.net/5AdTe/1/

感謝

來源

2013-04-10 Aram Mkrtchyan

3事情，我看到的都是錯誤的，都在其他塊在線21

else if(leftOfImg + $(".slider img").width() && !isLeft)

1）您在這裏需要一個邏輯運算符 '< />/==' 不是 '+'

2）當您動畫權

3 leftOfImg可變正變得越來越小）有在else塊中沒有返回語句，即使它啓動了，所以它只會保持動畫效果

來源

2013-04-10 15:42:41 DaveB

我不能這樣做:( – 2013-04-10 17:09:40

jquery單圖像滑塊

回答

相關問題