JQuery Изотоп - предотвратить Изотоп делать первоначальный переход

Question

Я использую изотоп с CSS, такие как

.isotope-item { 
    -webkit-transition-duration: 0.8s; 
    -moz-transition-duration: 0.8s; 
     -ms-transition-duration: 0.8s; 
     -o-transition-duration: 0.8s; 
      transition-duration: 0.8s; 
} 

, что делает мой макет сделать 0.8 переход даже в исходное состояние. Я бы хотел, чтобы он не переходил изначально, но сохраните переход 0.8s на изменение размера или добавьте элемент

Answer 1

Почему бы вам не переделать переход на медиа-экране, чтобы, например, если ваш изотопный контейнер равен 980px;

@media screen and (min-width: 0px) and (max-width: 981px) { 
    -webkit-transition-duration: 0.8s; 
    -moz-transition-duration: 0.8s; 
    -ms-transition-duration: 0.8s; 
    -o-transition-duration: 0.8s; 
    transition-duration: 0.8s; 
} 

переход будет происходить только между 0-980px в

Answer 2

Избегайте имеющие .isotope класса, приложенный к контейнеру изначально установив опцию containerClass в пустую строку сначала, а затем установив .isotope класса на контейнер после начальный макет произошел.

var containerClassSet = false, 
    $container = $('#container'); 
$container.isotope({ 
    containerClass: '', 
    onLayout:  function ($elems, instance) { 
     if (!containerClassSet) { 
      containerClassSet = true; 
      setTimeout(function() { 
       $container.addClass('isotope'); 
      }, 0); 
     } 
    } 
}); 

Обеспечение того, чтобы ваши классы начинаются с .isotope:

.isotope .isotope-item { 
    ... 
}