Scenarist Popup Menu Tutorial by Deluxe-Menu.com
Scenarist Popup Menu Tutorial

Template:






    - Items with icons
    - Personal CSS styles for separate menu elements
    - Top items and submenus have a shadow
    - Deluxe Tuner - visual interface to create and modify dhtml menus easily and in no time.
    - Transition #14 - "fade out" effect
    - Sound support!
    - UL/LI items structure
    - AJAX menu loading - loads web menu data from the server "on-the-fly".




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

Menu Screenshots

Scenarist Popup Menu Tutorial Html Menu Scripts Jscript Javascript

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

Features

Easy Setup
  • De Luxe Tuner. GUI interface to create your scenarist popup menu tutorial menus easily and in no time
  • Sensible menu parameters for manual editing
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!
Create Pop Up Menu Scenarist Popup Menu 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
  • Section 508 compliant
High Performance
  • AJAX menu loading - loads web menu data from the server "on-the-fly".
  • Commonly loads quicker than other html page elements
  • UL/LI items structure
  • Runs well with an unlimited number of submenus and items
Cost Effective



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

Javascript Menu. DHTML Menu.

  • Build right-click menus for your site. For this purpose you should appoint a peculiar method for the object you want. The current X,Y of the mouse pointer or your own ones can be used for the context menu.
  • Design menus absolutely based on CSS (Cascading Style Sheets). It is possible to apply the personal CSS styles for every elements of the menu.
  • When the submenu is bigger than the visible page area, the size of submenu will be automatically decreased. To view all the submenu items you do not need to use scrollbars or something like that - just put your mouse to the bottom of a submenu and it will be automagically scrolled! You can also define width and height for each submenu.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: When I stay on one page (for example "Home") аlso must have the menu-point "home" another color or font. How can I make this?


A: You should set pressed item.
Please, check the following parameter

  var pressedItem=-2;
This parameter sets an index of an item that will be highlighted by default.
-2 - the toggle mode is disabled;
-1 - the toggle mode is enabled, but no items highlighted by default;
0,1,2,3,... - index of highlighted item in a top-menu.

Deluxe Menu v2.4 has only two states normal and mouseover. Now we'repreparing new version of Deluxe Menu. It saves it state after thereloading of the page. We're planing to release a new version during a month.

You can set a pressed item using Javascript API:

function dm_ext_setPressedItem (menuInd, submenuInd, itemInd, recursion)

Sets a current pressed item.
menuInd - index of a menu on a page, >= 0.
submenuInd - index of a submenu, >= 0.
itemInd - index of an item, >=0.
recursion = true/false - highlight parent items.

But notice, to use dm_ext_setPressedItem() you should know ID of selected item and subitem.
You can't get this ID after you reload your page. That is why you should write your own code on PHP.
You can also set the correct
  var pressedItem=1;
parameter on each html page.


Q: How do your users normally indicate which page a web visitor is on, by using your navigation bar submenu?

A: Deluxe Menu has only two states normal and mouseover.

Try to do the following things:

- delete   var pressedItem=1; parameter from your data file
- set correct parameter on each page before you call data file, for
example:

<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript">  var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<script type="text/javascript">  var pressedItem=3;</script>
...
<script type="text/javascript" src="menudir/data.js"></script>

You can also set a pressed item using Javascript API:

function dm_ext_setPressedItem (menuInd, submenuInd, itemInd, recursion)

Sets a current pressed item.
menuInd - index of a menu on a page, >= 0.
submenuInd - index of a submenu, >= 0.
itemInd - index of an item, >=0.
recursion = true/false - highlight parent items.

But notice, to use dm_ext_setPressedItem() you should know ID of selected item and subitem.
You can't get this ID after you reload your page. That is why you should write your own code on PHP.



Q: I am having a problem trying to figure out how to generate a link to a popup window.
I looked at what you have on your site but it is not clear to me.


A: You can show the popup window when you hover, click or mouseout on some elements on your
page. For example you've added an image in your html page. You should specify the ID for it, for example:

<p><img id="open_popup" border="0" src="images/submenu-bg.gif" width="170" height="29"></p>
In the Deluxe Tuner you should enter 'open_popup' object ID in the onMouseOver,
onClick or onMouseOut fields.

Actually you can assign id to any object on your page manually. You should specify ID's - id="xxxx"
for <a>, <div>, <img> ... tags.

Or you want to open a popup onMouseover, onClick or onMouseout on a link.

So, you should create a link (you can also use other object) on your page and set id="" for it,
forexample:

<a href="javascript:;" id="link">Open popup OnClick</a>
<a href="javascript:;" id="over">Open popup OnMouseover</a>
<a href="javascript:;" id="out">Open popup OnMouseOut</a>

In Deluxe Tuner you should set:
onMouseOver - over
onMouseOut - out
onClick - link

If you want to show the popup when your page loads you should leave these fields empty:
onMouseOver:"",
onMouseOut:"",
onClick:"",

Q: Is it possible to expand thetree menu javascript in a predefined way?
Lets say, Item 1 expanded, Item 2 not expanded, anyway, it should look like I select it in the ITEMS program window.
Now it is exanded completely or not, like I use the switch in the common parameters.



A: You can expand some items by default.
Add '+' sign before items text in that case:

["+Deluxe Tree: XP Style","", "deluxe-tree.files/xpicon1_s.gif", "", "", "XP Title Tip", "", "0", "", "", ],
 ["|Home","testlink.htm", "deluxe-tree.files/icon1_s.gif", "deluxe-tree.files/icon1_so.gif", "", "Home Page Tip", "", "", "", "data-new.js", ],

"Deluxe Tree: XP Style" item will be expanded by default in that case.
Use   var texpanded=1; parameter to expand all menu items by default.

Use function dtreet_ext_expandItem (itemID, expand) API function to expand the specificmenu items dynamically:
http://deluxe-tree.com/functions-info.html

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