The description of the properties will soon be completed. The following item properties may be placed:
fx("here"); |
| Example: fx("text=Home;url=http://www.fxsinus.com;") |
Please note: The syntax for style properties and menu properties slightly differs from the syntax for item properties (the quotes!).
Menu items have three different states: when mouse pointer is out of the item ("mouseout"), over the item ("mouseover") or the item gets clicked ("mousedown"). Usually you have for each state a complete set of properties; for example: textdown, imagedown, bgcolordown, colordown, ... allowing you to give each item an individual style depending on the active state.
|
| Property | Description | Example |
| text | Text or HTML that will be printed within item's rectangle. If you want to define an image based menu, use "image" instead of "text". Instead of using "image" and "text" in the same item, use HTML as "text". | text=FX Menu;
text=<b>Download FX Menu</b>; |
| texton | Text or HTML, that appears on "mouseover"-event. Feature is not supported by Opera 5 and Opera 6. If you haven't defined "text" the menu doesn't display "texton". | texton=FX Menu - reloaded; |
| textdown | Text or HTML, that appears on "click"-event. Feature is not supported by Opera 5 and Opera 6. | textdown=FX Menu; |
| image | Image-path for image based menus. | image=fredsguitar.gif; |
| imageon | Image, that appears on "mouseover"-event. "image" is necessary to use this feature. | imageon=fredsguitaron.gif; |
| imagedown | Image, that appears on "click"-event. | imagedown=fredsguitardown.gif; |
| imagematch | Requires: "match". | imagematch=guitarmatch.jpg; |
| url | Enter URL, leave blank or use "javascript:myfunction(myvalue)". If you want to go to an URL and call a JavaScript function at the same time use the "functiondown" property. | url=fredsguitar.html; |
| urldelay | Delay to show an "down" style of an item, before you are forwarded to the "url". Attention: A defined JavaScript function in "url" will be executed with a delay too. Unit is milliseconds. | urldelay=1000; |
| target | "Target" can be used to open new browser windows or to link to frames. If "target" isn't set, the url opens in the same window. If the "target" is set, but the frame is not available the url opens in a new window. For iframes use the property "iframe". | target=myframe;
target=blank;
target=parent;
target=top; |
| iframe | Use "iframe" instead of target, if you want to open a new page in an iframe. If the declared iframe is not available, the url opens in a new window. | iframe=myiframe; |
| match | Match with url, allows you to add specific styles to an item. "Match" is used to show visitors the currently active web page in your web project. For example: url=../mygeneralprojects.html; match=mygeneralprojects;
If the string "mygeneralprojects is found in url, the item gets a new style, which can be individually defined with all properties that end with "match" (colormatch, bgcolormatch, iconmatch, ...) | match=url;
match=../intropage.html |
| status | Message, that appears in the window statusbar, when you move your mouse over the item.
Not available in Opera 5/6 and Firefox 1.0 (preview release). | status=View My Guitars; |
| title | Info appears in a small layer, (behaves like a common title-tag or alt-tag in images). Enter any text.
Is not supported by Opera browser. | title=My Guitar Collection; |
| cursor | Displays a different cursor on "mouseover" event in all DOM-compliant browsers(MSIE 5+, NETSCAPE 6+, OPERA 7+, ...). Valid values are: default, auto, crosshair, pointer, move, text, help and wait. Internet users expect a certain behaviour when they see a cursor, therefore you should choose the "cursor" carefully. For example when they see a move cursor, visitors expect the menu to be dragable.
| cursor=pointer; |
| cursormatch | Requires: "match". | cursormatch=text |
| paddingleft | | paddingleft=12; |
| paddingtop | | paddingleft=2; |
| align | | align=right; |
| fontfamily | | fontfamily=Arial,Verdana,Helvetica; |
| fontsize | When defining "fontsize" you can add the following units: pt or px. Other units are not supported. Units such as: "em" or "%" have quirks. If "fontsize" is not declared, property is inherited by the settings either for body or a tag. (In Netscape 4 default fontsize is 8pt.) If you are using (strict) doctype definitions, don't forget to add a unit to "fontsize". | fontsize=9pt;
fontsize=9 |
| fontsizeon | When defining "fontsizeon" you can add the following units: pt or px. Other units are not supported. Not available in Netscape 4. | fontsizeon=9pt; |
| fontweight | Valid values are normal or bold. | fontweight=normal; |
| fontweighton | Valid values are normal or bold. | fontweighton=bold; |
| fontweightdown | Valid values are normal or bold. | fontweightdown=bold; |
| fontstyle | Valid value is italic. | fontstyle=italic; |
| decoration | You can use here none or underline. | decoration=none; |
| decorationon | You can use here none or underline. | decorationon=underline; |
| decorationdown | You can use here none or underline. | decoration=underline; |
| color | HEX values or valid HTML colornames can be used here. | color=#808080; |
| coloron | HEX values or valid HTML colornames can be used here. | coloron=#000000; |
| colordown | HEX values or valid HTML colornames can be used here. | colordown=#003366; |
| colormatch | Requires: "match". HEX values or valid HTML colornames can be used here. | colormatch=#993300; |
| bgcolor | HEX values or valid HTML colornames can be used here. | bgcolor=#FFFFFF; |
| bgcoloron | HEX values or valid HTML colornames can be used here. | bgcoloron=#D2DEFF; |
| bgcolordown | HEX values or valid HTML colornames can be used here. | bgcoloron=#3366CC; |
| bgcolormatch | Requires: "match". HEX values or valid HTML colornames can be used here. | bgcolormatch=#003399; |
| bordercolor | HEX values or valid HTML colornames can be used here. | bordercolor=#000000; |
| bordercoloron | HEX values or valid HTML colornames can be used here. | bordercoloron=#3300CC; |
| bordercolordown | HEX values or valid HTML colornames can be used here. | bordercolordown=#FFFFFF; |
| borderlowcolor | HEX values or valid HTML colornames can be used here. | borderlowcolor=#808080; |
| borderhighcolor | HEX values or valid HTML colornames can be used here. | borderhightcolor=#FFFFFF; |
| bordercolormatch | Requires: "match". HEX values or valid HTML colornames can be used here. | bordercolormatch=#990033; |
| borderwidth | | borderwidth=1; |
| borderstyle | All valid CSS 1 and CSS 2 values can be set for "borderstyle". | borderstyle=solid; |
| borderstyleon | All valid CSS 1 and CSS 2 values can be set for "borderstyleon". | borderstyleon=outset; |
| borderstyledown | All valid CSS 1 and CSS 2 values can be set for "borderstyledown". | borderstyledown=outset; |
| borderwidthmatch | Requires: "match". | borderwidthmatch=2; |
| bgimage | | bgimage=mybgimage.gif; |
| bgimageon | | bgimageon=mybgimageon.gif; |
| bgimagedown | | bgimagedown=mybgimagedown.gif; |
| arrow | Enter image path. The image gets visible, if the item has a submenu. Important: Path has to be relative to the HTML-page, where the menu will be displayed and not relative to the js-file! | arrow=subimg.gif; |
| arrowon | | arrowon=subimgon.gif; |
| arrowdown | | arrowdown=subimgdown.gif; |
| arrowright | | arrowright=25; |
| arrowtop | | arrowtop=1; |
| icon | | icon=iconhome.gif; |
| iconon | | iconon=iconhomeon.gif; |
| icondown | | icondown=iconhomedown.gif; |
| iconmatch | Requires: "match". | iconmatch=iconhomematch.gif; |
| iconwidth | | iconwidth=22; |
| iconleft | | iconleft=5; |
| icontop | | icontop=1; |
| left | "Left" is used to force independet item positioning within the menu. The items are no longer positioned relative but absolute to the left corner of the menu. This feature is difficult to use and is not mandatory or explicit recommended. | left=5; |
| top | "Top" is used to force independet item positioning within the menu. The items are no longer positioned relative but absolute to the top corner of the menu. This feature is difficult to use and is not mandatory or explicit recommended. | top=50; |
| width | Sets the width of the item. This is mandatory | width=190; |
| height | Sets the height of the item. This is mandatory | height=30; |
| show | "Show" tells the item to open a submenu. You can open several submenus at once by repeating the command "show". | show=GuitarSubmenu; |
| type | Usually an item is overlapped by a layer to create a clickable area. With "type=form" you can remove the overlapping layer to display form elements like select boxes or textareas. "Type=header" can be used to convert the item into a static headline or to define several links to different locations in one item. | type=form;
type=header; |
| functionover | Allows you to define any JavaScript function. Works like an interface between the FX code and your own functions. Fired on "mouseover" event. | functionover=myfunction(); |
| functionout | Allows you to define any JavaScript function. Fired on "mouseout" event. | functionout=myfunction(); |
| functiondown | Allows you to define any JavaScript function. Fired on "click" event. | functiondown=myfunctiondown(); |
