Css Collapsible Area by Deluxe-Menu.com
Css Collapsible Area

Menu Screenshots

Css Collapsible Area Vertical Css Menu Navigation Examples

Features

Easy Setup
  • De Luxe Tuner. GUI interface to create your css collapsible area menus easily and in no time
  • Sensible menu parameters for manual editing
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed css collapsible area samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Web Navigation Design Css Collapsible Area
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!
Cost Effective
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



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Use a mouse to move a menu as a usual window. Also you can create the menu where each submenu can be "separated" from the menu (MS Office toolbar-like mode).
  • When the page is scrolled the menu remains visible. The menu can "float" along one or two coordinate axes.
  • There can be multilevel menus - create as many rows of the menu as necessary. Any submenu in its turn can include different number of columns.

Recent Questions

Q: I am interested in Deluxe Tabs MAC Style.
However before I do I want to make sure that:

- I can change the buttons pictures on both the first row and the second row. There has to be a <img src=" " > tag in the code somewhere, correct?


- I can expand or diminish the number of buttons and links


- Also, I have a question: if I am on "Mac Tab 1" menu, and I click on "Mac Tab 2" menu without clicking on any of the links onthe second row, what is the page that I see? Do I see by default Link 2_1 or do I see some kind of generic page? In other words is there a "main" page for each tab menu and then you have the other pages which correspond to Link 2_1, Link 2_2, etc.?

- Is it possible to remember a visited sub-menu? For example I am on "Mac Tab 2/Link 2_3" and I go to "Mac Tab 4/Link 4_2" and then I come back to "Mac Tab 2". Can the main page for this "Mac Tab 2" be Link 2_3 which was my last visited link on that tab?


A: 1) No, there is no such tag - <img src=" " >

For the main items you should set such parameters:
bbeforeItemImage - left part of the item
bafterItemImage - right part of the item
bitemBackImage - center part of the item

in normal, mouseover and selected states.

And for the subitems (in MAC template) you should set onlybitemBackImage - the center part of the item.

Please, see the code of this template.

2) You can create any number of the buttons and links.

3) You can set links for main items and for the subitems.
For example:

  var bmenuItems =
[
["Mac Tab 1","http://deluxe-menu.com",,,,,,],
 ["|Link 1_1","http://apycom.com",,,,,,"0"],
 ["|Link 1_2","testlink.htm",,,,,,"0"],
 ["|Link 1_3","testlink.htm",,,,,,"0"],

So, if you click on "Mac Tab 1" you will go to http://deluxe-menu.com
And if you write so
["Mac Tab 1","",,,,,,],
no page will open.

4) This Tab menu can save pressed item automatically within1 page only. If you open another page, the menu can't remember presseditem. You should do that manually using Javascript and menu parameters(  var bselectedItem,   var bselectedSmItem) or using any server-sidescript (php, asp, etc.)


Q: How do I center a menu item inthe drop down menu example?

A: Try to use the following parameter:

  var itemAlignTop="center";

Q: I can’t seem to figure out how to specify the width of individual items in the website drop down menu.
I would like to specify that each menu item on the horizontal take up just 113px
regardless of the number of characters in the item.
Is there a way of doing that?

A: You should use   var itemStyles to set an individual item style, forexample:

  var itemStyles = [
["itemWidth=113px"]
];

  var menuItems = [
["text 1", "link", "icon1", "icon2", "tip", "target", "0"],
["text 2", "link", "icon1", "icon2", "tip", "target", "0"],
["text 3", "link", "icon1", "icon2", "tip", "target", "0"],
];

Where "0" - style number in itemStyles that contains the parametersfor items width.

Use Deluxe Tuner GUI to create and assign individual styles.



Q: I just purchased the Deluxe PopUp Window application in order to implement some pop up window on my web site the way I need them to work.

Infact, after taking a look at your application it doesn't seem (maybe I'm wrong) it can be used the way I need to.

To cut a long story short: I need the PopUP window onclick to show images and not texts pening up them by clicking on a text-link.

Images are many so, if I not wrong I must create lots of windows each one for each single image.

So, my questions are:

1) Can I use you pop up to show images only?

2) Can I activate them by clicking on the related links.

Generally, in order to do so, I have a single js script that activate the window onclick. To load a Popup window I need to click on a link by opening an HTML page containing the image.

To let it all work I need a <script> function in the <head> </head> tags and an onclick command calling the PopUp script activated when I click on the related link.

So, does your script work the same way. Can you confirm me that I can use your application just the same way as I have always done with a simple .js script + an .htm page containing an image?

I hope I was clear.

A: You can call only one data file and use deluxePopupWindow.open() function to open your windows:

<a href="javascript:;" onclick="deluxePopupWindow.open('window1', '<img src=\'img/DSCN3699.jpg\'>',
'Window1','width=100,height=100,resizable,scrollbars=no,middle,right,fade-effect',
'simple')">Click Here to see a chase1 sample</a>



See more info:
http://deluxepopupwindow.com/window-installation-info.html
http://deluxepopupwindow.com/samples.html