@Richswitch
junior

Как добавить transition с помощью jQuery?

Привет!
Есть вот такое меню
ecba29d3f75d42ffa98e224f9769b08e.png
При нажатии на li родительского элемента ul
<ul class="controls">
	<li class="filter active" data-filter="all">Все</li>
	<li class="filter" data-filter=".webdesign">Веб-дизайн</li>
	<li class="filter" data-filter=".development">Веб-разработка</li>
</ul>


происходит добавление класса active с помощью jQuery:
$('.controls li').click(function(){
	$('.controls li').removeClass('active');
	$(this).addClass('active');
});

Уже 30 мин. ищу правильный метод для jQuery чтобы сделать плавный переход при смене класса active.

Делал так, но я могу быть не прав, поправьте меня пжлст.
$('.controls li').click(function(){
        $('.controls li').ЗДЕСЬ ЧТО-ТО ДОЛЖНО БЫТЬ('slow');
	$('.controls li').removeClass('active');
	$(this).addClass('active');
});
  • Вопрос задан
  • 568 просмотров
Решения вопроса 1
lazalu68
@lazalu68
Salmon
Если вы оперируете классами, то за анимацию отвечает CSS:

.controls li {
    background-color: transparent;
    transition: all 1s ease 0s;
}
.controls li.active {
    background-color: #98312A;
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы