Menu Horizontal Sliding Side by Deluxe-Menu.com
Menu Horizontal Sliding Side

Template:

Youtube Style Template 2 - Drop Down Navigation Menu







    - Items with icons
    - Text aligned to left
    - Transition #14 - "fade out" effect
    - 85% transparency for sub menus
    - Image arrows
    - Hundreds of pre-designed templates
    - Status string shows item labels
    - Top items and submenus have a shadow




2 0 Navigation Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  Blog   ::  More Info

Menu Screenshots

Menu Horizontal Sliding Side Javascript Drag Select Image

Buy Now!   ::  Free Trial Download   ::  More Info

Features

Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed menu horizontal sliding side samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Seamless Integration
  • Cross-frame support - menus work on frameset-based pages
  • Visible over flash, select boxes, iframes, java applets
  • Multiple menus on the same page
  • Amicable to other scripts and css styles
  • Any HTML code can be used inside menu items
Sample Java Script Menus Menu Horizontal Sliding Side
Compatibility              
  • Full cross-browser compatibility including IE, Netscape, Mozilla, Opera, Firefox, Konqueror and Safari on Windows, Mac OS and Linux
  • Menu can be populated from a database using ASP, PHP, etc.
  • Search engine friendly
  • Support for any doctypes
  • Fits for secure sites
  • Section 508 compliant
Cost Effective
Unrivalled Features
  • Scrollable, dragable, floating, right-click menus
  • Keyboard navigation - press Ctrl+F2 to enter the menu
  • Unique Java Script API for altering menu "on-the-fly", without page reloading
  • AJAX technology - loads menu data from the server "on-fly and on-demand".
  • Search feature - add the search area in the menu and type symbols. The found words will be higlighted.
  • Sound support!



2.0 Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  More Info

Javascript Menu. DHTML Menu.

  • Setup menu parameters manually or using De Luxe Tuner. Then add some rows of a code within html page code and your menu is ready!
  • Use special Java Script methods for: Dynamic changing of items (link, text, icons, arrows and even individual style!). Addition/removing of items or submenus. Disabling and enabling menu items. Getting the info on every submenu, menu, and items. Changing appearance of items. Other coding tricks.
  • Cross-frame mode lets you to construct full-featured dhtml menus on the pages with frames. But for all that frame set it's not necessary to insert any additional code into all the pages - just specify several extra menu parameters.
  • Ability to handle the menu from the keyboard via keystrokes.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: How do I create more space between the menu items?

I have tried adding to the Item Appearance, itemSpacing and itemPadding.


A: You can paste the separator.
Please, see the following parameters:

//------- Separators -------
  var separatorWidth = "10";
  var separatorHeight = "20";
  var separatorAlignment = "center";
  var separatorImage = "C";
  var separatorVWidth = "150";
  var separatorVHeight = "10%";
  var separatorVImage = "image.jpg";

You can create separators using menuItems, for example:

  var menuItems = [
["item 1"],
["-"], // this item is separator
["item 2"],
];

You can also use this parameter:

  var itemPadding = "4px";

You can also set multiple values, for example:

  var itemPadding = "2px 15px 5px 5px";

(top, right, bottom, left)


Q: I think I am almost there.
I would like to know a couple of things.

Why the menu does not float?
Why I cannot centre the menu?


A: When you use floatable menu you can't use relative menu position.
So, if you use
  var absolutePos = 0;
and to center the menu you use <p> or <div> with the center alignment your menu won't float.
To center your floatable menu you should set absolute coordinates.
  var absolutePos = 1;


Q: I had to put the site live and had taken out the white border. I've used one of the better elements of your application and put a second data file (data1.js) and a sample page up that recreates the aberrant behavior in IE and the missing border-bottom in Firefox and Opera.

In IE, the entire border of each element has about a 5px white border until you mouseover each element. Then the border-bottom (1px solid white) shows correctly.

In both Firefox and Opera the border doesn't show at all.


A: Try to write so:

  var absolutePos=1;
  var posX="10";
  var posY="400";

  var itemStyles = [
["itemBorderWidth=0 0 1px 0","itemBorderStyle=solid,solid","itemBorderColor=#FFFFFF,#FFFFFF"],
];


Q: I like your product a lot. These are the features that, unfortunately, cannot be done and hope that you can address them. I will place the order right away if these are resolved:
1. For each individual item, allow attaching a customized javascript to fire up "onclick" and "nomouseover".

2. Allow using a variable size icon for each item.


A: 1. You're able to use Javascript for each item, for example:

  var tmenuitems = [
["item text", "javascript:your_code_here"]
];

Unfortunately, you can't assign onmouseover event to each item.
However, you can achieve this by using standard html objects withinitems, for example:

  var tmenuitems = [
["<div onmouseover='your_code_here'>item text</div>", "index.html"]
];

2. DHTML Tree Menu uses constant icon size for all icons.
If you wantto use different icon dimensions, you can use standard <img>elements within items:

  var tmenuitems = [
["<img src='icon.gif' width=10 height=10>item text", "index.html"]
];


Buy Now!   ::  Free Trial Download   ::  More Info