У меня есть строка меню, которая изначально прозрачная, но если пользователь начинает листать сайт, то она меняет цвет. Меняю цвет я с помощью удаления и добавления класса с прописанным цветом (это важно и этого я изменить не могу) Но цвет меняется резко. Можно ли сделать плавный переход от прозрачного цвета фона к цвету фона прописанному классу, который я добавляю элементу. Возможно, можно как-то "плавно добавлять класс" через JS?
Код JS
var windowTop = $(window).scrollTop();
windowTop > 75 ? $('#mainhead').addClass('navShadow') : $('#mainhead').removeClass('navShadow');
Код CSS
nav {
background: transparent;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
nav.navShadow {
background: linear-gradient(to right, #000, #fff);
}
Спасибо!