Графика
До Navigator 3.0 в JavaScript были только встроенные объекты типа Image. В новой версии языка появился конструктор для этого типа объектов:
new_image = new Image()
new_image = new Image(width, height)
Часто для создания мультипликации формируют массив графических объектов, которые потом прокручивают один за другим:
img_array = new Array()
img_array[0] = new Image(50,100)
img_array[1] =new Image(50,100)
...
img_array[99] = new Image(50,100)
У объекта Image существует 10 свойств, из которых, на мой взгляд, самым важным является src. Так, для присваивания конкретных картинок элементам массива img_array следует воспользоваться следующей последовательностью команд:
img_array[0].src = "image1.gif"
img_array[1].src = "image2.gif"
...
img_array[99].src = "image100.gif"
В данном случае можно было воспользоваться и циклом для присвоения имен, так как они могут быть составлены из констант и значения индексной переменной.
В новой версии языка объект типа Image может быть поименован в HTML-теге IMG. После этого можно обращаться к нему по имени. Здесь следует учитывать, что если Image применяется внутри формы, то он является свойством этой формы. В одном случае для следующего графического объекта должны быть использованы разные составные имена:
<img name=car src=car.gif>
<form name=kuku>
<img name=car src=car.gif>
</form>
document.kuku.car.src = "car1.gif"
В первом случае задан поименованный объект типа IMG, а во втором объект этого же типа, но внутри формы.
Однако наиболее часто в примерах использования скриптов можно встретить обращение к Image по индексу в массиве всех графических объектов данной страницы. Если наш объект, например, второй Image на странице, то будь он внутри формы или за ее пределами, к нему всегда можно обратиться по индексу: document.images[1].src = "car1.gif". Расширяя пример с массивом Image, построим теперь документ, в котором будет встроена мультипликация, определенная нашим массивом:
<HTML> <HEAD> <SCRIPT>
function multi_pulti() {
img_array = new Array()
img_array[0] = new Image(50,100)
...
img_array[99] = new Image(50,100)
img_array[0].src = "image1.gif"
...
img_array[99].src = "image100.gif"
n=0
while(n==0){
document.images[0].src = img_array[0].src
...
}</SCRIPT>
</HEAD>
<BODY onLoad="multi_pulti()"> <img src=image1.gif> </BODY>
</HTML>
Довольно часто используют не мультипликацию, а выбор картинки через OPTION, другой новый объект JavaScript. При этом можно через поле формы SELECT менять не только саму картинку, но и гипертекстовую ссылку, которая может быть связана с ней. На гипертекстовую ссылку также можно выходить по индексу:
document.links[index].href = kuku.html
Данный прием оправдан и с точки зрения интерфейса навигатора. При применении такого рода массивов ссылок не требуется перечислять их, а также листать страницы в рабочей области навигатора - можно просто выбрать ссылку из "выпадающего" меню. Другой способ для сокращения числа нажатий на клавиши - использование событий. В том же объекте OPTION можно применять событие onChange, что делает необязательным нажатие кнопок типа submit. В этом случае достаточно будет просто выбрать альтернативу и перейти к новой странице сразу после выбора.
