Активная
картинка - картинка, которая меняет сой вид в
зависимости от действий посетителя. Простейший
тому пример - картинка изменяется после
проведения над ней курсора мыши. В этой статье я
расскажу вам как осуществить эту идею.
Первое, что нужно
сделать, задействовать основной скрипт. Его мы
поместим между тегами <head> и </head>. Выглядит
скрипт так:
<SCRIPT>
<!--
if (document.images) {
image1on = new Image();
image1on.src = "swap_pic1.gif";image1off
= new Image();
image1off.src = "swap_pic.gif";
}
function turnOn(imageName) {
if (document.images) {
document[imageName].src = eval(imageName + "on.src");
}
}
function turnOff(imageName) {
if (document.images) {
document[imageName].src = eval(imageName + "off.src");
}
}
-->
</SCRIPT> |
|
Используемые
обозначения:
swap_pic.gif - Картинка, которая
будет отображаться первоначально
swap_pic1.gif - Картинка, которая загорится
после подведения мыши |
Основное уже сделано. Теперь
браузер знает и обычную картинку и
"активную". Осталось только указать ему, где
вставлять картинку. Выбирайте место, где
требуется эта картинка и на ее месте
прописываете следующее:
<a href="HTTP://MASTE.RU"
onMouseOver="turnOn('image1')" onMouseOut="turnOff('image1')">
<img name="image1" src="swap_pic.gif" alt="Пример
активной картинки" width="100" height="50"
border="0"></a> |
|
| Параметры alt, width
и height меняйте в зависимости от
конкретной ситуации. |
Теперь
осталось проверить, что же получилось:
Скрипт
работает как в Internet Explorer, так и в Netscape Navigator, в
связи с чем вы можете не опасаться за его
работоспособность в зависимости от типа
браузераю Вы можете использовать этот скрипт
неограниченное число раз на одной странице. Все
упирается только во возможности браузера и
компьютера :) Юзайте на здоровье :)
(C) DVK URL CLUB
Автор: Кушнерук Денис (DVK)
HTTP://MASTE.RU
.: |
