Самоучитель по JavaScript

         

Разбор скрипта


  • Не забывайте про регистр и <script language= "javascript">

function up()
{
document.mypic.src="up.gif"
}

function down()
{
document.mypic.src="down.gif"
}

  • Функции выполняют то же, что и команды на прошлом уроке. Помните иерархию объектов? Сначала документ, потом имя, присвоенное объекту и наконец SRC. Функции названы up() и down().

<A HREF="http://www.newmail.ru"


onMouseOver="up()" onMouseOut="down()">
<IMG SRC="down.gif" NAME="mypic"
BORDER=0></A>

  • Схема практически та же, что и на прошлом уроке.
  • Oбычно функция используется для многократных повторений, мы просто хотели сделать наш пример короче.
  • Если вы решите использовать многократные смены картинок с помощью JavaScript, помните, что каждый раз нужно давать функции и изображению новое имя. Например: вы хотите поместить на страницу еще один такой же скрипт. Для этого создаем новую функцию, копируя предыдущую и добавляя к ее названию цифру 2. Затем меняем имя рисунка на mypic2. Не забудьте поменять его и в строке img src="*.gif". Получаем следующее:

<SCRIPT LANGUAGE="JavaScript">

function up() {
   document.mypic.src="up.gif"
}
function down() {
   document.mypic.src="down.gif"
}

function up2() {
   document.mypic2.src="up.gif"
}
function down2() {
   document.mypic2.src="down.gif"
}

</SCRIPT>

...идве разные картинки:

<A HREF="http://www.htmlgoodies.com"
onMouseOver="up()" onMouseOut="down()">
<IMG SRC="down.gif" NAME="mypic"
BORDER=0></A>

<a href="http://www.htmlgoodies.com"
onMouseOver="up2()" onMouseOut="down2()">
<IMG SRC="down.gif" NAME="mypic2"
BORDER=0></A>

Видите, как новые функции связаны с новыми именами? Делайте это каждый раз при добавлении новой картинки.



Содержание раздела