HTML: Популярный самоучитель

ОглавлениеДобавить в закладки К обложке

Реализация меню

Итак, с меню связаны два сценария. Первый находится в файле create_menu.js и записывает в HTML‑документ строки, создающие таблицы – раскрывающиеся меню и таблицу строки меню. Рассмотрим содержимое этого файла (пример 14.2).

Пример 14.2. Содержимое файла create_menu.js

/*

Сценарий в этом файле вставляет в документ определение пунктов меню,

а также определение строки главного меню (выполняется при загрузке)

*/

//Определение меню "Информация"

document.write("<TABLE id = \"general\" class = \"hidden\">");

document.write("<TR id = \"general_history\" class = \"item\"");

document.write("onMouseOver = \"general_history.className = 'selected'\"");

document.write("onMouseOut = \"general_history.className = 'item'\">");

document.write("<TD><A href = \"history.html\">История</A></TD>");

document.write("</TR>");

document.write("<TR id = \"general_values\" class = \"item\"");

document.write("onMouseOver = \"general_values.className = 'selected'\"");

document.write("onMouseOut = \"general_values.className = 'item'\">");

document.write("<TD><A href = \"values.html\">Пищевая ценность яблок</A></TD>");

document.write("</TR>");

document.write("<TR id = \"general_collectsave\" class = \"item\"");

document.write("onMouseOver = \"general_collectsave.className = 'selected'\"");

document.write("onMouseOut = \"general_collectsave.className = 'item'\">");

document.write("<TD><A href = \"collectsave.html\">Сбор и хранение яблок</A></TD>");

document.write("</TR>");

document.write("</TABLE>");

//Определение меню «Сорта яблок»

document.write("<TABLE id = \"types\" class = \"hidden\">");

document.write("<TR id = \"types_summer\" class = \"item\"");

document.write("onMouseOver = \"types_summer.className = 'selected'\"");

document.write("onMouseOut = \"types_summer.className = 'item'\">");

document.write("<TD><A href = \"summer.html\">Летние</A></TD>");

document.write("</TR>");

document.write("<TR id = \"types_autumn\" class = \"item\"");

document.write("onMouseOver = \"types_autumn.className = 'selected'\"");

document.write("onMouseOut = \"types_autumn.className = 'item'\">");

document.write("<TD><A href = \"autumn.html\">Осенние</A></TD>");

document.write("</TR>");

document.write("<TR id = \"types_winter\" class = \"item\"");

document.write("onMouseOver = \"types_winter.className = 'selected'\"");

document.write("onMouseOut = \"types_winter.className = 'item'\">");

document.write("<TD><A href = \"winter.html\">Зимние</A></TD>");

document.write("</TR>");

document.write("<TR id = \"types_deepwinter\" class = \"item\"");

document.write("onMouseOver = \"types_deepwinter.className = 'selected'\"");

document.write("onMouseOut = \"types_deepwinter.className = 'item'\">");

document.write("<TD><A href = \"deepwinter.html\">Позднезимние</A></TD>");

document.write("</TR>");

document.write("</TABLE>");

//Определение меню «Рецепты»

document.write("<TABLE id = \"recepts\" class = \"hidden\">");

document.write("<TR id = \"recepts_salat\" class = \"item\"");

document.write("onMouseOver = \"recepts_salat.className = 'selected'\"");


Логин
Пароль
Запомнить меня