|
Find more DHTML for web designers.
About HBar Use this tool if you want to add a horizontal navigation bar consisting
of many tabs to your site. Such a menu has a very user-friendly interface
and makes it considerably easier to navigate through the website.
It is usually used to navigate through the main sections of the site.
Menus created with it are completely based on CSS and do not use
scripts that is why they are most attractive for search engines.
These menus perfectly work in all modern browsers. We have successfully
tested them in Internet Explorer 6, FireFox 1.0, Opera 9, Konqueror
3.5.2, Netscape 7.
Horizontal Bar Builder consists of three sections: Items, Style
and Output. Use the Items section to add/remove menu tabs, the Style
section to edit the appearance of the tabs and the Output section
to get the final HTML/CSS code of the menu.
Items (see screenshot)
The Items section consists of the tab list, buttons for adding/removing tabs
and several edit fields for changing the parameters of tabs.
The Add Item button adds a new tab. Clone Item adds a new tab with the parameters
of the selected tab. Delete Item deletes the selected tab.
The Text field is used to edit the text that is displayed on the menu tab. The
Hint field is used to specify the text of the hint that appears when you move
the mouse pointer over the tab. The URL field is used to specify the hyperlink
that is opened when you click the tab. The URL Target is used to specify the
frame where the hyperlink should be opened (leave the field blank to open it
in the same window or enter "_blank" to open it in a new browser window). You
can select the Current checkbox to indicate the current section in the menu.
Style (see screenshot)
The Style section consists of the Common Settings and Tab States sections. Use
the Common Settings section to edit the general appearance of the tab appearance
and the Tab States section to edit the appearance of the tab in three different
states: Normal, Over and Current, where Normal corresponds to the normal state
of the tab, Over corresponds to the state when the mouse pointer is over it and
Current corresponds to the tab with the Current checkbox selected. The Tab States
section also has the Tab Parts subsection that is used to edit the appearance
of three different components in the tab: Left, Middle and Right.
Output (see screenshot)
To get the HTML/CSS code of the menu, you should enter the name of the menu and
specify the directories containing the CSS file with the styles of your site
and the subdirectory with image files. These parameters are necessary to generate
the correct code and to save images used in the menu. Use the Save Images button
to save all images necessary for the menu to the selected subdirectory. Click
Generate Codes to generate the CSS/HTML code of the menu. The generated code
is displayed in two text areas below. Copy them and use them on your site. |
