Phoca Tree Tutorial by Deluxe-Tree.com
Phoca Tree Tutorial


Buy Now!  Free Trial Download

Menu Screenshots Phoca Tree Tutorial

Phoca Tree Tutorial Horizontal Tree Scroll

Features Phoca Tree Tutorial

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
Seamless Integration
  • 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
Menu Program Tree Phoca Tree Tutorial
Unrivalled Features
  • Scrollable, dragable, floating
  • 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".
High Performance
  • AJAX menu loading - loads web menu data from the server "on-the-fly".
  • Commonly loads quicker than other html page elements
  • Runs well with an unlimited number of submenus and items
Cost Effective
Buy Now!  Free Trial Download

Javascript Tree Menu. Expandable Menu.

  • There can be as many submenus as you want.
  • Use a mouse to drag a menu as a usual window.
  • When the page is scrolled the menu remains visible. The Javascript/DHTML Tree can "float" along one or two coordinate axes. After clicking on menu item selected item becomes highlighted.

Recent Questions Phoca Tree Tutorial

Q: I can not however find the option to move submenus closer together, I have too much ident for my taste.
How can I change that, by hand if that is the only way...

I mean this:

MENU1
    +    SUBMENU1

I would like

MENU1
   + SUBMENU1

Is that possible?


A: If you don't want to have icons before item text you can write so:

//------- Icons -------
  var ticonWidth = 0;
  var ticonHeight = 0;
  var ticonAlign = "left";

Your items will be closer to the "+" buttons.


Q: What I would like to see is the ability to have a base site navigation menu with all the definitional entries (size, locations, icons, etc.) defined but all the menuitems be called from an Ajax file.

A: You cannot use ajax submenus for the top items.
But you can use several .js file, for example:

params.js //file with all menu parameters (size, locations, icons, etc.)
all code before
  var menuItems = [
...
];
dm_init();

data_ajax1.js //data files for ajax submenus
data_ajax2.js
data_ajax3.js
...

main_data.js - data file with the following code:

  var menuItems = [
["Item 1","", "", "", "", "", "0", "0", "data_ajax1.js", "", "", ],
["Item 2","", "", "", "", "", "0", "0", "data_ajax2.js", "", "", ],
["Item 3","", "", "", "", "", "0", "0", "data_ajax3.js", "", "", ],
["Item 4","", "", "", "", "", "0", "0", "data_ajax4.js", "", "", ],
];
dm_init();

You can also place this code into your html page directly (in the place where you want tohave a menu):

<script type="text/javascript">
  var menuItems = [
["Item 1","", "", "", "", "", "0", "0", "data_ajax1.js", "", "", ],
["Item 2","", "", "", "", "", "0", "0", "data_ajax2.js", "", "", ],
["Item 3","", "", "", "", "", "0", "0", "data_ajax3.js", "", "", ],
["Item 4","", "", "", "", "", "0", "0", "data_ajax4.js", "", "", ],
];
dm_init();


Q: More importantly, my last tab is showing up as active when the page with java floating menu loads...

A: See the following parameter:

  var bselectedItem=0;
You should set index of the item you want to select.



Q: How can I set a top menu as a link in the web tree view?
Also, some of the parent menu items don't work as a link even though areconfigured as links.


A: Actually you cannot use links for the top items in the XP Style.
But theoretically you can use links for the top items. You can write

["<a href='index.html' class='home' target="frame">Home</a>","", "", "", "", "Return to Index page", "", "0", "", ],
["<a href='http://www.domain.uk' class='home' target="frame">About Us</a>","", "", "", "", "", "", "0", "", ],
 ["|Introduction","http://www.domain.uk/introduction.htm", "", "", "", "", "", "", "", ],