Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Лабораторная работа7.doc
Скачиваний:
6
Добавлен:
10.11.2019
Размер:
68.61 Кб
Скачать

Вертикальное меню со стрелкой

<HTML> 

<HEAD>

<TITLE>Вертикальное меню со стрелкой</TITLE> 

<script language="JavaScript"> 

function IMG (pict, action) 

{

if (action)

{ pict.src="butl.gif" } 

else

{ pict.src="butO.gif" } 

}

</script> 

</HEAD> 

<BODY background="fon1.jpg">

<H2><FONT соlоr="#0000ff">Содержание</FONT></Н2> 

<nobr> <IMG src="but0.gif" width="31" height="31" name="pl"> 

<A href="tchl.htm" onmouseover="IMG(pl,true)"

onmouseout="IMG(pi,false)"> 

<IMG src="pchl.gif" аlt="форматирование текста" border="0" 

width="103" height="35"></A>

</nobr> <br> 

<nobr><IMG src="but0.gif" width="31" height="31" name="p2">

<A href="tch2.htm" onmouseover="IMG(p2, true)"

onmouseout="IMG(p2, false)"> 

<IMG src="pch2.gif" alt="co3flaHMe списков" border="0" width="103" 

height="35"></A> 

</nobr> <br>

<nobr><IMG src="but0.gif" width="31" height="31" name="p3"> 

<A href="tch3.htm" onmouseover="IMG(p3, true)" 

onmouseout="IMG(p3, false)"> 

<IMG src="pch3.gif" alt="построение таблиц" border="0" width="103" 

height="35"></A> 

</nobr> <br>

<nobr><IMG src="but0.gif" width="31" height="31" name="p4"> 

<A href="tch4.htm" onmouseover="IMG(p4,true)" 

onmouseout="IMG(p4,false)"> 

<IMG src="pch4.gif" а="использование графики" border="0" 

width="103" height="35"></A>

</nobr> <br>

<nobr><IMG src="but0.gif" width="31" height="31" name="p5"> 

<A href="tch5.htm" onmouseover="IMG(p5,true)" 

onmouseout="IMG(p5,false)">

<IMG src="pch5.gif" alt="создание фреймовой структуры" 

border="0" width="103" height="35"></A> 

</nobr> <br> 

</BODY> 

</HTML>

 

Задание6. Введите и отредактируйте листинг программы. Горизонтальное графическое меню со стрелкой

Напишем сценарий, реализующий горизонтальное графическое меню. При наведении курсора мыши на пункт меню сверху от выделенного пункта появляется стрелка.

При создании горизонтального графического меню используем таблицу, состоящую из двух строк, по пять ячеек в каждой. Пункты меню в виде графических изображений хранятся в ячейках второй строки. Если выбран некоторый пункт меню, то над ним появляется стрелка. Назначение функции IMG () такое же, как и в предыдущем примере. Обратите внимание на вызов указанной функции: вместо логического значения можно использовать 0 или 1.

Горизонтальное меню со стрелкой

<HTML> 

<HEAD>

<TITLE>Горизонтальное меню</TITLE> 

<script language="JavaScript"> 

function IMG(pict, action) 

{ if (action)

{pict.src="rbutl.gif"} 

else

{pict.src="rbutO.gif"} 

}

</script>

</HEAD> 

<BODY background="fonl.jpg">

<H2><FONT colorг="0000ff">Содержание</FONT></Н2> 

<TABLE cellspacing=0 cellpadding=0> 

<TR>

<TD align=center><IMG src="rbut0.gif" 

width="31" height="31" name="pl"></TD> 

<TD align=center><IMG src="rbut0.gif" 

width="31" height="31" name="p2"></TD> 

<TD align=center><IMG src="rbut0.gif" 

width="31" height="31" name="p3"></TD> 

<TD align=center><IMG src="rbut0.gif" 

width="31" height="31" name="p4"></TD>

<TD align=center><IMG src="rbut0.gif" 

width="31" height="31" name="p5"></TD> 

</TR> 

<TR>

<TD><A href="tchl.htm" target="Main" onmouseover="IMG(pl, 1)" 

onmouseout="IMG(pl, 0)"> 

<IMG src="pchl.gif" а="форматирование текста" 

border="0" width="103" height="35"></A></TD> 

<TD><A href="tch2.htm" target="Main" onmouseover="IMG(p2, 1)" 

onmouseout="IMG(p2, 0}"> 

<IMG src="pch2.gif" а="создание списков" 

border="0" width="103" height="35"></A></TD> 

<TD><A href="tch3.htm" target="Main" onmouseover="IMG(p3, 1)" 

onmouseout="IMG(p3, 0}">

<IMG src="pch3.gif" alt="nocTpoemie таблиц" 

border="0" width="103" height="35"></A></TD> 

<TD><A href="tch4.htm" target="Main" onmouseover="IMG(p4, 1)" 

onmouseout="IMG(p4, 0)"> 

<IMG src="pch4.gif" а="использование графики" 

border="0" width="103" height="35"></A></TD> 

<TD><A href-"tch5.htm" target="Main" onmouseover="IMG(p5, 1)" 

onmouseout="IMG(p5, 0)"> 

<IMG src="pch5.gif" alt="создание фреймовой структуры" 

border="0" width="103" height="35"></A></TD> 

</TR> 

</TABLE> 

</BODY> 

</HTML>

 

Задание7. Создайте собственный сценарий не менее 3-х страниц с использованием динамической графики.