Помогите с небольшим эффектом на JS. При наведении курсора..

картинки - два разных файла?

можно вообще без яваскрипта сделать.

две картинки, отличаются только цветом: одна темная, другая светлее.

<div class="a"><div class="b"></div></div>

.a { width: 100px; height: 100px; background: url('light.jpg') no-repeat center center; }

.b { width: 100px; height: 100px; background: url('dark.jpg') no-repeat center center; }

.b { opacity: 1; }

.b:hover { opacity: 0; }

.b { transition: all 500ms ease-in-out;

-moz-transition: all 500ms ease-in-out;

-o-transition: all 500ms ease-in-out;

-webkit-transition: all 500ms ease-in-out;

}

если JS то темная картинка не нужна - канва имеет фильтры а в ИЕ такие фильтры были и до HTML5 канвы.

dkameleon, у меня получается, что при наведении на картинку она просто исчезает плавно)

а мне бы чтобы она переходила плавно в другую картинку.

---------- Добавлено 26.05.2012 в 20:16 ----------

а не, понял как она работает)

---------- Добавлено 26.05.2012 в 20:19 ----------

вот только когда я навожу на картинку первая не исчезает.

первая (светлая) и не должна.

темная находится перед светлой и при наведении плавно становится прозрачной - следовательно темная плавно преобразуется в светлую.

Перефразирую немного:

Есть две картинки. На экране видна одна картинка. При наведение на эту картинку она плавна переходит в другую.

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

ПС. по крайней мере на новых адекватных броузерах :)

между тегами див чтонибудь ставить надо?

нет. скиньте картинки - я вам сделаю конечный вариант.