Как избавиться от мерцании при анимации?

Question

[Socrates]

Ребят, такая проблема.
Что есть:
делаю сдайдер, следующий слайд заблюрен (filter:blur(3px); ) при перемещении его на текущий слайдер убираем blur;
использую transition для анимирования.
Проблема:
Вроде работает, но происходят мерцания, как от них избавиться ?
Сайт: pn.tmweb.ru

Comments

[Socrates]

или есть готовое решение для подобного слайдера?

Answer 1

[boga-net]

Посмотрел ваш слайдер с хрома и мозиллы - не увидел никаких мерцаний. Может вы не прописали префексы для свойства transition ?

-webkit-transition: filter .5s;
   -moz-transition: filter .5s;
     -o-transition: filter .5s;
        transition: filter .5s;

Слайдер работает кривовато. На последнем слайдет застывает. Попробуйте slick.js.
Активному слайду "slick-active" добавляйте новый класс с filter: blur

Comments

[boga-net]

Socrates, а у вас мерцания по прежнему присутствуют? Может дело в вашем браузере?
Может эти мерцания создаёт какой-то другой эффект, который не обрабаьтывается transition? Попробуйте отдельно протестировать только эффект blur, без всего остального. Возможно, так получится вычислить то, что создаёт мерцание