 |
 |
 |
|
|
Сайт посвященный WEB Дизайну |
|
 |
|
 |
|
|
|
|
|
|
|
|
|
|
Статьи по:
|
|
|
|
JavaScript: Простые визуальные эффектыСмена изображений (часть первая)
В веб-дизайне часто возникает необходимость заменить одно изображение на другое. Суть смены изображений заключается в том, чтобы с помощью сценария изменить значение атрибута SRC тега <IMG>. Напомним, что атрибут SRC имеет в качестве значения строку, указвающую месторасположение графического файла. Если элемент <IMG> , задающий изображение, содержится в HTML-документе, то в объектной модели имеется объект этого элемента со свойством src. Значение этого свойства можно изменить в сценарии. При этом в окно браузера загружается соответствующий графический файл, если, разумеется, он будет найден. В следующем примере щелчок на изображении из файла pictl.gif заменяет его изображением из файла pict2.gif. Поскольку сценарий очень небольшой, он записан в строке, которая присваивается атрибуту onclick тега <IMG>.
<HTML> В приведенном выше примере смена изображения происходит лишь при первом щелчке на нем. Последующие щелчки не приведут к видимым изменениям, поскольку второе изображение будет заменяться им же. Чтобы повторный щелчок приводил к отображению предыдущего рисунка, сценарий необходимо слегка усложнить: следует создать переменную-триггер (так называемый флаг), принимающий одно из двух возможных значений. По текущему значению флага сценарий может определить, какое именно из двух изображений следует отобразить. После смены изображения необходимо изменить и значение флага. Далее приведен вариант кода:
<IMG ID = "myimg" SRC = 'pictl.gif' onclick = "imgchange()">
|
|
|
|
|
|
|
|
|
|
