Xwab
Форумыnavigate_next Графика/Дизайн

смена картинки при наведения курсора
Сообщения
SkoRoST

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

22 Авг 2011, 18:04
Kovalsky

SkoRoST,
css:
.link {background-image: url(image1.png);}
.link :hover img{background-image:url(image2.png);}

html:
<a class="link" href=""></a>

как то так видимо

22 Авг 2011, 18:11
жук

на яваскрипте атрибуты onMouseOver и onMouseOut

22 Авг 2011, 18:26
SkoRoST

Kovalsky, спасибо  попробую щас
добавлено спустя 26 секунд:
жук, и тебе спасибо
добавлено спустя 12 минут:
Kovalsky, чет не работает код  просто ссылку выводит и все

22 Авг 2011, 22:28
FENIKS

SkoRoST, немного не так вот правильный

2. Kovalsky (Off)Жал|Отв
22 Авг, 19:11
SkoRoST,
css:
.link {background: url(image1.png) repeat;}
.link :hover img{background: url(image2.png) repeat;}

///Если изоброжение будешь растягивать то оставь repeat если нет то замени на no-repeat

и если будешь ратягивать укажи размеры в классе и псевдоклассе width и height

html:
<a class="link" href=""></a>

как то так видимо

22 Авг 2011, 22:54
Vynderkind

5. Не будет оно роботать. Нужно при наведения курсора, а не после клика по картинке.
В посте 3 вроде верно сказано)

22 Авг 2011, 23:07
FENIKS

Vynderkind, ммм почему же не будет?все работает)
могу пример дать)
добавлено спустя 2 минуты:
короче в пример а то я там сам что то запутался

.link{
background: url(link1.png) no-repeat;
}
.link:hover{
background: url(link2.png) no-repeat;
}

22 Авг 2011, 23:13
manyrus

<div class="link"><a href="#"> наведи</a></div>

22 Авг 2011, 23:39
FENIKS

о точно про хтмл ссылку забыл исправить гг извиняюсь

22 Авг 2011, 23:40
manyrus

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

22 Авг 2011, 23:43
Ответить на тему