@BedOmar
Веб-разработчик

Как анимировать .css('backgroundImage') в jquery?

Есть ф-ция измены изображения каждые 5 секунд в ней код:
$('#div_for_img').css('backgroundImage', 'url(img/intro/intro_'+n_active+'.jpg)');

Как анимировать изменение фона (что бы выглядело как fadeIn и fadeOut)
P.S. Нужно именно изменение фона а не переделывать всё в img
  • Вопрос задан
  • 134 просмотра
Пригласить эксперта
Ответы на вопрос 2
dom1n1k
@dom1n1k
Напрямую это не сделать никак, потому что к фону нельзя применить opacity отдельно от самого элемента. И аналога прозрачности, как у цвета rgba, у картинок нет.
Всё-таки нужен какой-то вложенный абсолютно спозиционированный элемент. Возможно img, возможно div с фоном, это не так уж важно. И вот уже он будет анимироваться.
Ещё вариант - засунуть в фон canvas и рисовать что-то анимированное на нём... Но это выглядит неоправданно сложно.
Ответ написан
Комментировать
ShadowOfCasper
@ShadowOfCasper
Middle User Interface Web Developer
Подобное невозможно будет анимировать, даже средствами fadeIn fadeOut, элементарно потому что на каждую картинку будет лететь запрос к серверу и хз как долго сервер будет отвечать. В любом случае скорость у всех разная и тайминга анимаци может просто не хватить.
Самый лучший способ - заабсолють на фоне слайдер, запихай туда дивов и накидай в них bgimage. (я так понимаю вопрос о фоне). В api укажи effect: fade. Все картинки будут подтягиваться сразу и эффект будет чистым, без задержек
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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