Форум

amator0 · #1 (**permalink**) 02.04.2014, 14:05

Здравствуйте! Есть такой код:

<body>
<div>
<a href="#" class="ok" onmouseover="
    document.body.style.backgroundImage = 'url(http://javascript.ru/forum/images/ca_serenity/misc/logo.gif)'
" onmouseout = "
    document.body.style.backgroundImage=''
"> тут </a>
</div>
</body>

При наведении на ссылку оно меняет быстро на другой фон. А как сделать так, чтобы при наведении на ссылку, оно плавно меняло фон, и возвращало так же.
Заранее спасибо!

ksa · #2 (**permalink**) 02.04.2014, 14:29

Сообщение от amator0

как сделать так, чтобы при наведении на ссылку, оно плавно меняло фон

Как ты себе это представляешь?
Как именно для тебя "плавно поменять" картинку?

danik.js · #3 (**permalink**) 02.04.2014, 14:31

Прозрачностью фона нельзя управлять. Поэтому нужно перенести картинку в отдельный элемент, который и будет играть роль фона.
На момент смены создаешь второй фон со второй картинкой и плавно меняешь прозрачность первого от 100% до 0, а второго - от 0 до 100%

Хотя, вот хром вроде умеет плавно менять background-image через transition, но это исключение.

amator0 · #4 (**permalink**) 05.04.2014, 18:39

Спасибо ребята! Что то значит попробую воплотить..

Форум

Справочник

Discord чат

Курсы javascript