每个点击动画背景位置

Question

我正在开发一个摄影组合主题，并且在为网站上的某个功能编写jQuery时遇到了一些问题。我试图完成的是让它每隔一次单击上一个和下一个图标时，缩略图的内联列表向左或向右移动110px（单个缩略图的宽度）。

$('.next').each(
    function(){ 
     $(this).bind (
      "click", 
      function(event){ 
       $('#thumbnailGallery ul').animate(
        {left:-110}, { 
         duration:'fast', 
         easing:'easeInSine' 
       }); 
      } 
     ); 
    } 
); 

$('.prev').each(
    function(){ 
     $(this).bind (
      "click", 
      function(event){ 
       $('#thumbnailGallery ul').animate(
        {left:110}, { 
         duration:'fast', 
         easing:'easeInSine' 
       }); 
      } 
     ); 
    } 
); 

我目前使用.each（）;函数使用onClick绑定动画，但动画仅出现一次。例如，如果我点击。下一步它将动画-110px，但是当我再次点击它不会。 .prev也是如此。

Answer 1

试试这个：

$('.next').each(
    function(){ 
     $(this).bind (
      "click", 
      function(event){ 
       $('#thumbnailGallery ul').animate(
        {left:"-=110px"}, { 
         duration:'fast', 
         easing:'easeInSine' 
       }); 
      } 
     ); 
    } 
); 

$('.prev').each(
    function(){ 
     $(this).bind (
      "click", 
      function(event){ 
       $('#thumbnailGallery ul').animate(
        {left:"+=110px"}, { 
         duration:'fast', 
         easing:'easeInSine' 
       }); 
      } 
     ); 
    } 
); 

应根据实例