Создание панели навигации

MAX's HTML Beauty++ позволяет создавать кнопки с так называемым Mouseover-эффектом. Эффект проявляется, когда на кнопку будет наведен курсор. При создании эффекта задействованы два изображения, которые сменяют друг друга.

В строке вкладок редактора щелкните по вкладке Script.
Щелкните по кнопке вставки JavaScript, выберите Crazy Menu. Откроется окно Beauty Scripts.


Меню 1





















Меню 2















Используйте кнопки:
Add (добавить)
Edit (редактировать),
Delete (удалить),
Clear All.. (Очистить все..)

При щелчке по кнопке Add появится еще одно окно:

First Image - первоначальное изображение
Second Image - вторичное изображение
Link - ссылка на веб-страницу
Status Bar Text - ?

Base Folder - Вы должны выбрать основную папку, чтобы вычислить относительные пути. Укажите папку, где находятся файлы, составляющие навигационную панель  (в т.ч. и изображения).

Target Frame - Это будет целевой рамкой для всех ссылок. Выберите, к примеру,  blank.

Введя эти данные, щелкните кнопку Generate - так Вы создаете одну кнопку с Mouseover-эффектом.
Но обычно такие кнопки применяются не поодиночке, а группами, образуя панель навигации.

Для создания панели навигации не спешите щелкать по Generate, а снова щелкните по кнопке Add и снова введите данные для второй кнопки (клавиши), затем для третьей и т.д.

Закончиа ввод данных, щелкните по Generate - редактор начнет генерировать код навигационной панели.
Щелкните по Copy to Clipboard (копировать в буфер обмена).
Щелкните по Close.


Щелкните на странице, в меню Edit или в контекстном меню выберите Paste (вставить).

Код состоит из двух частей. Одна часть вставляется в область заголовка <head></head>, вторая часть - в область основного содержания (в область <body>).

В область заголовка вставляется код, который начинается с комментария:
Place the following code in the <HEAD> section of your HTML file! - Поместите следующий код в <HEAD>  раздел Вашего файла HTML!

В область <body> вставляется код, который начинается с Place the following code where you want the menu item #1 to appear! -  Поместите следующий код, где Вы хотите, чтобы пункт меню  появился! (т.е. щелкните в том месте, куда нужно вставить соответствующую кнопку меню).
В приведенных примерах  навигационных панелей (слева)  кнопки помещены в ячейки таблицы.

Дополнительно: Создание кнопок - см. Кнопки.

Так как редактор MAX's HTML Beauty++ допускает применение любых изображений для создания кнопок, то навигационную панель можно создать как из однотипных кнопок (см. Меню 1), так и из разных. В принципе, самые разные кнопки можно наделать из всего, что попадется под руку (см. Меню 2).