JQuery фоновое изображение перехода

Question

У меня есть div, у которого в качестве фона есть изображение home.jpg, и я хочу, чтобы при щелчке чего-либо в качестве фона использовался 'another_image.jpg'. Дело в том, что я хочу, чтобы новый фон fadeIn, а не просто появлялся (выполняя некоторые .css ('background', url ('another_image.jpg'));)

Есть ли способ сделать это? Я пробовал плагин bgImageTransition, но он просто добавляет еще один элемент поверх div, который у меня был ...

Спасибо

Answer 1

Единственный способ сделать это - закрасить другой элемент новым фоном.

Кроме того, вы можете немедленно изменить фон, затем создать новый элемент со старым фоном и затемнить его out .

Answer 2

Вы должны проверить это сообщение в блоге об анимации фоновых изображений ... это очень крутой эффект.Все, что вам нужно сделать, это превратить ваши два изображения в спрайт и использовать этот скрипт.

Вот демоверсия .

Answer 3

РЕДАКТИРОВАТЬ: добавлен эффект перекрестного затухания: http://jsfiddle.net/8vHa2/3/

(щелкните логотип JQuery)

Имейте в виду, что для такого рода эффектов требуется второй элемент, который должен исчезнуть илив, поэтому я рекомендую вам придерживаться плагина, который вы пытались.