Template: Efl Family Tree Chart

Vista Style 7 Tree Dhtml Menu

The template emulates Vista OS menu style. This is image based template. To open submenus click on menu items.
The appearence of this template is determined by the following parameters:

    - Toggle-mode support. Animation effect for subitems
    - Icons for the expand/collapse buttons
    - Background image for the menu
    - Menu has a static position and is placed within the table cell

Key features:

    - Vertical orientation of the Tree Menu
    - Several menus on one page
    - Personal CSS styles for separate menu elements
    - Inactive/Disabled items
    - different speed for an animation for submenus
    - Submenus expand/collapse on mouseover
    - Relative/Absolute menu position
    - Filters and Transitional effects

Menu Screenshots Efl Family Tree Chart

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

Features Efl Family Tree Chart

Easy Setup

De Luxe Tuner. GUI interface to create your efl family tree chart menus easily and in no time
Sensible menu parameters for manual editing

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".

Tendina Javascript Tree Efl Family Tree Chart

Professional Look-n-feel

Entirely customizable look-n-feel
A lot of pre-designed efl family tree chart samples
Hundreds of visual effects
Custom CSS styles can be applied for all menu settings

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

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

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

Javascript Tree Menu. Expandable Menu.

There is no need to write additional code on a server side to remember what items were expanded/collapsed. Javascript/DHTML Tree can save items state automatically!
When the submenu is bigger than the visible page area, you can use the scollbar for submenus to scroll your menu!

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

Recent Questions Efl Family Tree Chart

Q: How i can isert any html code in css dynamic menu?

A: You are able to paste any html code within items.
So you can paste a form too.

For example:

var menuItems = [

...

["||<nobr><FORM method=GET action='http://www.google.com/custom'><input name='as_q' value='searchthe web' size=15 style='font-size:10'> <INPUT type=hidden name=cof
value='LW:144;L:http://domain.edu/images/sulogo.gif;LH:45;AH:center;GL:0;S:
http://domain.edu;AWFID:e01cb67b8afe383e;'></form></nobr>","", "images/icons/search.gif", "", "", "", "", "2", "", "", "",],

Q: Is there a way with your script drop down menu to make the menus appear to be expanded when on a certain page?

A: No, unfortunately there is no way to expand JavaScript Tree Menu.

You can try to use Javascript/DHTML Tree, http://deluxe-tree.com in that case.
You can expand specific items in Javascript/DHTML Tree using

dtreet_ext_expandItem ()

function.

Find more info here:

http://deluxe-tree.com/functions-info.html

Q: I’d like to know how to populate the navigation bar menu from a database?

A: Please, see the example of .php file.The content of .php file depends on your database structure.

<?php

// The example for PHP/MySQL.
// MySQL database has the table "menuTable" that contains data for menu items.
// The table has the following fields:
// 1. "text" - item text
// 2. "link" - item link
// 3. "icon1" - item icon (normal state)
// 4. "icon2" - item icon (mouseover state)
function getMenuItems()
{
$jsItems = '';

// Select all records from table "menuTable"
$allItems = mysql_query('SELECT * FROM menuTable;');

// Extract items data from database and build Javascript code for menuItems
while ($itemData=mysql_fetch_array($allItems))
{
$jsItems .= '["'.$itemData['text'].'", "'.$itemData['link'].'", "'.$itemData['icon1'].'", "'.$itemData['icon2'].'"],';
}

// Return Javascript code
return $jsItems;
}

?>

<script>
  var menuParam1 = value1;
  var menuParam2 = value2;
  var menuParam2 = value2;
...

  var menuItems = [

// Write Javascript code for menu items
echo getMenuItems();

?>

];
</script>

Q: I am unable to see any separators when working with JavaScript Tree Menu. I’ve looked at other templates and don’t see where they are implemented. Am I missing something? Thanks!

A: Please, see the following parameters:

//------- Separators -------
//--- Separators
  var separatorImage="";
  var separatorWidth="5";
  var separatorHeight="100%";
  var separatorAlignment="right";
  var separatorVImage="images/public/separator.gif";
  var separatorVWidth="3";
  var separatorVHeight="100%";
  var separatorPadding="";

You should set a separator in the menuItems, for example:

  var menuItems = [
["Home","index.cfm", , , , , , , , ],
["-"],
["About Us","about.cfm", , , , , , , , ],

];

Try that.

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