Как реализовать плавную смену background с наплывом?

Question

[Лев Салатов]

Доброго времени суток, уважаемое сообщество!

Возникла проблема реализации ПЛАВНОЙ смены фонового изображения body с одновременным увеличением.
Подробнее:
открылся сайт, background body плавно увеличивается внутрь, затем происходит плавная смена background и опять плавное увеличение внутрь.

Помогите, пожалуйста! У Яндекса и дяди Гугла спрашивал - ничего не нашел.
Заранее спасибо за помощь!

Answer 1

[Alexander Lashchevsky]

Либо используйте CSS:
body {transition: background .15s linear;}

Либо JS:
$(body).animate();

При необходимости поэтапной смены фона, т.е. сначала одно, потом второе, потом третье -Вам CSS уже особо не поможет. Самый простой вариант будет такой:

$(body).animate();

// Ждём 500 милисек и делаем новые эффекты
$(body).delay(500).animate(); 

// Ждём ещё 500 милисек и делаем новые эффекты
$(body).delay(500).animate();

Comments

[Tony Ter]

Только в jQuery скобки не фигурные должны быть: .animate()

[Alexander Lashchevsky]

Tony: да, опечатался, исправил, спасибо.

Answer 2

[Lumore]

https://www.google.com/search?q=transition

Answer 3

[kolibry1]

design-mania.ru/web-design/html-css/fonovoe-slajdshou3 вот этот метод мне оочень нравится