当动画时,流沙边缘会改变



在一个网站上工作

http://lsmcreative.co.nz/

我得到一个有趣的错误,当使用导航过滤拇指。当动画

时,图像会奇怪地向左移动

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

我的代码是这样的

,当你点击菜单上的按钮时,拇指会突然向左移动200px,然后再回到原来的位置。

    // 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();
        });
      });
    }); 

我添加了

左:2.9702970297% !重要;到li

的CSS

然后

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

最新更新