| Главная » Статьи » HTML для сайта » HTML коды для вашего сайта |
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
| Вариант 1 [b][color=#ff0000]<div id="galery_1"> <a href="http://Ссылка"> <img src='http://kibertrem.ucoz.ua/images/Knopki/knopka_1.png' width="370" /* Ширина рисунка */ height="71" /* Высота рисунка */ alt="название" onmouseover="this.src='http://kibertrem.ucoz.ua/images/Knopki/knopka_2.png'" onmouseout="this.src='http://kibertrem.ucoz.ua/images/Knopki/knopka_1.png'" border=0></a>[/color] [color=#ff0000]</div>[/color][/b] Вариант 2 [b][color=#ff0000]<!DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>Эффект перекатывания</title> <style> a.rollover { background: url(images/sun1.png); /* Путь к файлу с исходным рисунком */ display: block; /* Рисунок как блочный элемент */ width: 196px; /* Ширина рисунка */ height: 183px; /* Высота рисунка */ } a.rollover:hover { background: url(images/sun2.png); /* Путь к файлу с заменяемым рисунком */ } </style> </head> <body> <p><a href="#" class="rollover"> </a></p> </body>[/color] [color=#ff0000]</html>[/color][/b] | |
| Просмотров: 804 | |
| Всего комментариев: 0 | |
