Я пытаюсь отключить css-переходы высоты и ширины элементов при фильтрации с использованием изотопа. Итак, просто элементы исчезают или появляются и перемещаются - без масштабирования.
Я пробовал все виды модификации css для стандартных переходов css: http://isotope.metafizzy.co/docs/animating.html#css_transitions, но безуспешно.
Возможно ли это без доработок плагина?
Вот демонстрация того, что у меня есть на данный момент: http://codepen.io/2kp/pen/nAGkp < / а>
В итоге я пошел по пути изменения самого плагина (удалив transform:"scale(0.001)" и transform:"scale(1)"), поскольку переопределение объектов hiddenStyle и visibleStyle не работало (как это было предложено в документации Isotope http://isotope.metafizzy.co/options.html#visiblestyle).
Надеюсь, это поможет! Похоже на ошибку в плагине.
Просто пытаюсь сделать что-то подобное, анимируя только непрозрачность + высоту, а не ширину, и думаю, что на своем пути я нашел решение, которое работает для вас - по крайней мере, я на это надеюсь!
Просто добавьте это в свой JS:
$('#container').isotope({
// options...
transformsEnabled: false
});
и измените CSS на:
.isotope .isotope-item {
-webkit-transition-property: top, left, opacity;
-moz-transition-property: top, left, opacity;
-ms-transition-property: top, left, opacity;
-o-transition-property: top, left, opacity;
transition-property: top, left, opacity;
}
