动画时流沙边距发生变化

Question

在网站上工作

http://lsmcreative.co.nz/

我在使用导航过滤拇指时遇到了一个有趣的错误。动画时，图像会向左奇怪地移动

容器是相对位置的，就像文档我不确定发生了什么

我的代码是这样的

几乎当您单击菜单中的按钮时，拇指会突然向左推 200 像素，然后动画回到原位？

    // Custom sorting plugin
    (function($) {
      $.fn.sorted = function(customOptions) {
        var options = {
          reversed: false,
          by: function(a) { return a.text(); }
        };
        $.extend(options, customOptions);
        $data = $(this);
        arr = $data.get();
        arr.sort(function(a, b) {
          var valA = options.by($(a));
          var valB = options.by($(b));
          if (options.reversed) {
            return (valA < valB) ? 1 : (valA > valB) ? -1 : 0;              
          } else {      
            return (valA < valB) ? -1 : (valA > valB) ? 1 : 0;  
          }
        });
        return $(arr);
      };
    })(jQuery);

    // DOMContentLoaded
    $(function() {

      // bind radiobuttons in the form
      var $btn = $('#navigation ul li a');

      // get the first collection
      var $projectThumbs = $('#portfolio');

      // clone applications to get a second collection
      var $data = $projectThumbs.clone();

      // attempt to call Quicksand on every form change
        $btn.click(function(e) {

            e.preventDefault();
            if($(this).data("type") == "all"){

               $btn.removeClass("selected");
               $(this).addClass("selected");
               var $filteredData = $data.find('li');

             } else {

               $btn.removeClass("selected");
               $(this).addClass("selected"); 

               var $filteredData = $data.find('li[data-type~=' + $(this).data("type") + ']');
        }   // end $btn.click function

        $projectThumbs.quicksand($filteredData, {
          adjustHeight: 'auto', // This is the line you are looking for.                        
          duration: 800,
          easing: 'easeInOutQuad'
        }, function(){
            // call js on the cloned divs
            $("a.grouped_elements").fancybox();

        });

      });

    }); 

Answer 1

我通过添加修复它

左：2.9702970297%！重要；到 li 的 css

然后

#portfolio li:nth-child(3n+1){
    margin-left:0;
}