Листинг 3.1, б. Исследование свойств изображений

<HTML>

<HEAD>

<TITLE> Исследование свойств изображений </TITLE>

<script>

<!--

function chpict1()

{ var w=document.forms[0].elements[0].value

var h=document.forms[0].elements[1].value

if (w!=0)

document.images[0].width=w

if (h!=0)

document.images[0].height=h

document.images[0].border=document.forms[0].elements[2].value

document.images[0].alt= document.forms[0].elements[3].value

}

//-—>

</script>

</HEAD>

<BODY bgcolor="F8F8FF">

<CENTER>

<НЗ>Встраиваемые иэображения</НЗ>

<IMG src=pl.gif>

<FORM>

Для изменения размеров изображения введите значения

одного или двух параметров и нажмите на кнопку <В>Просмотр</В><br>

ширина (width): <input type="text" size=8><br>

высота (height): <input type="text" size=8><br>

Для задания рамки введите число, определяющее толщину рамки

в пикселах, и нажмите на кнопку <В>Просмотр</В><br>

толщина рамки (border): <input type="text" size=8 value=0><br>

Альтернативный текст (alt): <input type="text" size=40><P>

<input type="button" value= "Просмотр" onclick="chpict1()">

<input type="reset" value="Отменить">

</FORM>

</CENTER>

</BODY>

</HTML>

Обратите внимание, что в этом варианте не заданы параметры name в HTML-тегах. В них нет необходимости, т. к. доступ к необходимым значениям осуществлялся на основе объектной модели JavaScript.

Перестановка изображений

Напишем сценарий, который реализует обмен рисунков в документе. Пусть в документе расположено четыре изображения, пронумерованных от 1 до 4 (рис. 3.4). В текстовых полях указываются номера рисунков, которые необходимо поменять местами. Требуется, чтобы после нажатия кнопки Поменять местами изображения переместились на нужные места.

Сначала проверим, правильно ли заданы номера изображений, если это не так, то выдадим сообщение. Переменная z служит для запоминания адреса первого графического изображения. Доступ к изображению с номером r1 производится с помощью конструкции document, images [r1-1]. Для того чтобы на место изображения с номером ri поместить изображение с номером г2, требуется выполнить оператор присваивания:

document.images[r1-1].src=document.images[r2-l].src

И, наконец, на место изображения с номером г2 помещается изображение, которое ранее было на месте с номером ri, и адрес которого запомнили в переменной z:

document.images[r2-l].src=z

Приведем полностью документ со сценарием (листинг 3.2).


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: