LATEST EVENTS
NEW CSS FILES
Rate Our Program
- Download menu.js file from our site
- Download CSS file from our site or create one
- Add the following string to HTML body:
<SCRIPT SRC="menu.js" LANGUAGE="JavaScript"></SCRIPT><NOSCRIPT><a href="http://free-javascript.all-faqs.info/">Advanced JSMenu 0.3.1</a> </NOSCRIPT> - Add link to CSS file:
<link rel="stylesheet" type="text/css" href="your.css">or addSTYLEtag to HTML header
- Add
onLoadevent toBODYtag:<BODY onLoad="initMenu();"> - Add a visible link back to http://free-javascript.all-faqs.info
- Now you can create menu just adding simple code with
MENUtags in your HTML
Customizable with CSS
Eearch engines friendly
Each menu is implemented as plain HTML on the page, making the menu contents search engine friendly and potentially much easier to deploy and customize than menus where the contents are stored inside the script.Widespread Compatibility
The ideal dhtml menu must be able to maintain its appearance, functionality and performance in any browser. To this end, we have tested our menu on a variety of browsers and platforms. The list below are examples of browsers that Advanced JSMenu is compatible with:- IE4 and above
- Netscape 4.05 and above
- Opera 6 and above
- Mozilla
- Firefox
- Safari
- Galeon
- Konqueror
Free
Our Solutions will grant free licenses to all users. The only free license requirement is that there must be a visible link back to http://free-javascript.all-faqs.info on all pages that use the menu.- Download menu.js file from our site
- Download CSS file from our site or create one
- Add the following string to HTML header:
<SCRIPT SRC="menu.js" LANGUAGE="JavaScript"></SCRIPT><NOSCRIPT><a href="http://free-javascript.all-faqs.info/">Advanced JSMenu 0.3.1</a></NOSCRIPT> - Add link to CSS file:
<link rel="stylesheet" type="text/css" href="your.css">or addSTYLEtag to HTML header:
<STYLE>MENU {border: 1px solid #555555; font-size: 8pt; font-weight: 600; font-family: Arial; padding: 2px 2px 2px 2px; vertical-align: middle; position: absolute; left: 0px; top: 0px; background-color: #5292CC; display: block; margin: 0px 0px 0px 0px; filter:revealTrans(transition=12,duration=0.5) progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#7b7b7b,strength=3);} MENU A {text-decoration: none; color: white;} #MAIN_MENU {border-style: none !important; display: block !important; left: 180px; top: 155px; background-color: #5292CC; color: white; filter:progid:DXImageTransform.Microsoft.Shadow(direction=90,color=#5292CC,strength=0; );} MENU SPAN {background-color: transparent; padding: 2px 2px 2px 2px; border: 1px none white; vertical-align: middle; cursor: pointer; display: inline ! important;} MENU DIV {background-color: transparent; padding: 2px 2px 2px 2px; border: 1px none white; vertical-align: middle; cursor: pointer; display: block ! important;} .HOVER {background-color: #2C75DA; padding: 1px 1px 1px 1px; border: 1px solid white; vertical-align: middle; cursor: pointer;} .EXPANDABLE {padding: 2px 2px 2px 2px; border: 1px none white; vertical-align: middle; cursor: pointer; background-image: url('img/drop-down.gif'); background-repeat : no-repeat; background-position : right center;} .EXPANDABLEHOVER {background-color: #2C75DA; padding: 1px 1px 1px 1px; border: 1px solid white; vertical-align: middle; cursor: pointer; background-image: url('img/collapse.gif'); background-repeat : no-repeat; background-position : right center;}
</STYLE> - Add
onLoadevent toBODYtag:<BODY onLoad="initMenu();"> - Add a visible link back to http://free-javascript.all-faqs.info
- Now you can create menu just adding simple code with
MENUtags in your HTML:<MENU id="MAIN_MENU" sound="/sounds/bip.wav">
<SPAN><a href="home.html">HOME</a></SPAN>
<SPAN menu="PRODUCTS_MENU">PRODUCTS</SPAN>
<SPAN><a href="search.html">SEARCH</a></SPAN>
<SPAN><a href="help.html">HELP</a></SPAN>
</MENU>
<MENU id="PRODUCTS_MENU" sound="/sounds/bip.wav">
<DIV><a href="product1.html">PRODUCT 1</a></DIV>
<DIV><a href="product2.html">PRODUCT 2</a></DIV>
</MENU>
Details
Tag <MENU>
Attributes: sound, open, closesound: path to sound file which play on all menu items rollover
open: possible values (onclick). If not defined submenu opens on mouseover event.
onclick - submenu opens only on menu item click
close: possible values (onclick, onclickout). If not defined submenu closes on mouseout event.
onclick - submenu closes only on menu item click
onclickout - submenu closes on any menu item click
Tip: use
<MENU> to create drop down menus which opens on mouseover
and closes on mouseoutTip: use
<MENU open="onclick"> to create drop down menus and hints
which opens on click and closes on mouseoutTip: use
<MENU open="onclick" close="onclick"> to create side menus and treesTip: use
<MENU open="onclick" close="onclickout"> to create tab
controls and side menusTags <DIV>,<SPAN>
Attributes: menu, sound, targetID, targetAttribute, targetValuemenu: ID of submenu
sound: path to sound file which play on menu item rollover. Overwright the value of MENU attribute.
targetID, targetAttribute, targetValue: set attribute defined in targetAttribute of the element with ID defined in targetID to value defined in targetValue.
Tip: use
<SPAN> for horizontal menus, and <DIV> for vertical onesTip: using targetID, targetAttribute, targetValue will make your menus more flexible. For example use
<DIV open="onclick" targetID="ScriptID" targetAttribute="src"
targetValue="someJavaScript.js">
to load and execute someJavaScript.js file on menu item click.
This could help you to create menus with comlex behaviour.