//**** DHTML Web Menu, (c) 2004, OpenCube Inc.,  -  www.opencube.com ****

//

//   DO NOT STOP HERE! - THIS TEMPLATE FILE CONTAINS ACTUAL MENU SETTINGS FOR sample.html

//

//   We recommend deleting the quick tips section below and other comments before

//   using this template on your web site to help reduce the total file size of your menu.







/*   Welcome to the DHTML Web Pointer Menu, below are some quick tips to help accelerate

     the learning curve.



     Don't be fooled by the tiny code size of the menu, its packed with almost every customization

     option imaginable. OpenCube created the internet's first commercial drop down menu using Java

     in 1996 and has provided navigation solutions to over 50,000 commercial web site customers.  Feel

     free to contact technical support if you are having difficulty reaching your implementation guidelines.



          Support Contacts & FAQs: http://www.opencube.com/support.html





     QUICK TIPS...



     -Menu text, URLs, icon images, sizing and orientation, plus more is all defined

      in this text file using the settings below.



     -Menu styles (colors, fonts, margins, etc.) are all defined in the menu_styles.css

      text file.



     -Several global settings which apply to all the web menus on your html page are locted

      in the head section of the html source (see sample.html source)



     -The menu is placed in the page with a simple JavaScript tag which acts as an inline

      element (same as positioning an image tag... use tables, div’s, spacer gifs, etc.).  See

      the sample.html source for a first hand look at the positioning tag.



     -There are no limits, use as many main menu items, sub menu items, levels, and icons as

      you need, the self explanatory indexing scheme is used below to create the sample menu.



     -Just as you can use numerical index values with some settings in this file to customize

      a specific sub menu group (i.e. this.is_horizontal0 = true) you can also use '_main'

      to refer to the main menu group.



     -To hopefully simplify matters, all supporting files for this sample (open sample.html

      in a browser to see the menu this settings file creates) are in this folder.



     -Typically the biggest confusion isn't how to customize the menu, rather how to get it

      into your web site.  Start by taking a thorough look at the source of the sample.html page.

      There are two basic things to do, copy the head section to your documents head (see

      sample.html source) and copy the positioning tag to the exact location in your source were

      you wish the menu to appear.  To tweak your folder locations do the following...



           Copy all the supporting script files to your desired script folder, then tell the menu

           were this folder is using the cdd__codebase setting in the head section of the html.



           Next, tell the menu were this data file is located.  First with the JavaScript ‘src’

           statement at the top of the head tag in the html source. Last with the cdd__database

           setting a little further down (next to the codebase setting).



     Terminate both the codebase and database values with a '/' character

           (i.e. cdd__codebase = "myscriptfolder/")





     -At this point the menu should be working in your html page, if not, 99% of the time its

      a simple typo in one of your settings causing the problem, everything must be exact or the

      entire menu will not function (test often, and be cautious).



     -You can comment out any indexed item in this file to disable it by using forward slashes...



           //everything here is ignored - works per line





     -Do not comment out default settings (non indexed), you may disable the menu.



     -You can target your links to a frame, new window, parent frame, etc. The most common

      request is how to target a specifically sized window, see the first sub menu items link

      in this file for a first hand look. (target a specific frame by setting the target

      value to the name of your frame)



     -All image references and URL links are defined relative to the location of this settings

      file on your site rather than the html page containing the menu (you can also use absolute

      links, http://...). This ensures accurate relative links, regardless of you html pages

      folder locations.



     -The reaction speed of the sub menu display is customizable using the cdd__showhide_delay,

      which is located in the global setting section within the html page.



     -To create multiple menus on one page... Make a duplicate of the entire menu data section in

      this document and give the 'cdd_menu0' function name (located on the first line of the data

      section) a new index number ('cdd_menu1').  When positioning, tell the web menu which one to use by

      adjusting the index value in the statement (example below uses 1)...



            <script language="JavaScript">create_menu(1)</script>





     -There is a special settings file for Netscape 4 to replicate the look of your menu in that

      browser.  Open 'menu_ns4_styles.js' and adjust to your specifications, the look of almost any

      menu can be duplicated and functionality is identical.



     -Use IE as your initial testing ground for the menu, then test and adjust the special settings as

      needed for other browsers.  By default the menu will function 100% identical in all browsers.

      Depending on your implementation the look may vary slightly for Netscape and opera, use the special

      settings mentioned above to exact the look in all browsers.



     -You can use any valid CSS settings beyond what is shown in the styles file for the menu except for

      dimension and position settings (width, height, top, left).  All dimensions and positioning of

      the sub menus and main menu group is defined in this file.



     -Only the width of both horizontal menu items and vertical menu groups may be defined (in this file).

      The heights of you items are automatically determined by the padding defined in the styles file,

      plus the size of the fonts or graphics you are using.



     -You can use HTML or plain text for any menu item, if using HTML keep the entire statement on one

      line and convert all double quotes to single quotes (see sample below...)



           this.item = "<img src='mygif.gif' width=10 height=10>sample item text"





     -Make all your sub menus optionally horizontal by setting the 'is_horitonzal' default parameter value

      below to 'true'. For a vertical main menu use, 'is_horizontal_main = false'.  Any combination of these

      parameters plus specific sub menu settings (i.e. 'is_horizontal1 = false') may be used to create

      any type or combination of layouts, this basic principal applies to all the settings in the file.



     -The cdd_pixel.gif file must be located in the same folder as the supporting script files.  This image

      file is used by the menu to position itself as an inline element in non-IE browsers.

*/











function cdd_menu0(){//////////////////////////Start Menu Data/////////////////////////////////

/**********************************************************************************************



  Menu 0 - General Settings and Menu Structure



  **See the menu_styles.css file for additional customization options**



***********************************************************************************************/



um0http = 1





/*---------------------------------------------

Icon Images

---------------------------------------------*/



//Define two types of unlimited icon images below, associate any image

//with any item using both the 'icon_rel' and 'icon_abs' parameter in the

//sub menu structure section (set to the index number of the icon image)





    //Relative positioned icon images (flow with main menu or sub item text)



  this.rel_icon_image0 = "graphics/gray_bullet.gif"

  this.rel_icon_rollover0 = "graphics/gray_bullet.gif"

  this.rel_icon_image_wh0 = "12,8"



  this.rel_icon_image1 = "graphics/red_arrow.gif"

  this.rel_icon_rollover1 = "graphics/red_arrow.gif"

  this.rel_icon_image_wh1 = "13,8"

  this.pointer_image_xy = "-9,0"      //x and y offset of pointer image



  this.rel_icon_image2 = "graphics/red_bullet.gif"

  this.rel_icon_rollover2 = "graphics/red_bullet.gif"

  this.rel_icon_image_wh2 = "12,8"



  this.rel_icon_image3 = "graphics/red_arrow3.gif"

  this.rel_icon_rollover3 = "graphics/red_arrow3.gif"

  this.rel_icon_image_wh3 = "13,8"

  this.pointer_image_xy = "-9,0"      //x and y offset of pointer image



  this.rel_icon_image4 = "graphics/adobe.gif"

  this.rel_icon_rollover4 = "graphics/adobe.gif"

  this.rel_icon_image_wh4 = "12,8"



  this.rel_icon_image5 = "graphics/red_arrow5.gif"

  this.rel_icon_rollover5 = "graphics/red_arrow5.gif"

  this.rel_icon_image_wh5 = "13,8"

  this.pointer_image_xy = "-9,0"      //x and y offset of pointer image







    //Absolute positioned icon images (coordinate positioned - relative to

    //right top corner of the menu item displaying the icon.)



  this.abs_icon_image0 = "graphics/red_arrow1.gif"

  this.abs_icon_rollover0 = "graphics/red_arrow1.gif"

  this.abs_icon_image_wh0 = "8,10"

  this.abs_icon_image_xy0 = "-9,5"







/*---------------------------------------------

Pointers & Dividers

---------------------------------------------*/





//Pointers are optional, specific settings override the default pointer.

//The x and y offset of each pointer image is relative to the upper left

//corner of the menu group using the pointer.







    //Pointer Settings



  this.pointer_image = "graphics/red_arrow1.gif"

  this.pointer_image_wh = "8,10"      //width and height of pointer image

  this.pointer_image_xy = "-9,0"      //x and y offset of pointer image



  this.pointer_image_main = "graphics/red_slider.gif"

  this.pointer_image_wh_main = "11,3"

  this.pointer_image_xy_main = "-7,1"



  this.pointer_image1_3 = "graphics/red_arrow2.gif"

  this.pointer_image_wh1_3 = "8,10"

  this.pointer_image_xy1_3 = "102,0"







    //Divider Settings



  this.use_divider_caps = false    //cap the top and bottom of each menu group

  this.divider_width = 1      //applies to horizontal menus only

  this.divider_height = 0      //applies to vertical menus only







    //available specific settings



  this.use_divider_capsX_X = true

  this.divider_widthX = 20

  this.divider_heightX = 10



  this.pointer_imageX = "../../graphics/arrow.gif"

  this.pointer_image_whX = "13,10"

  this.pointer_image_xyX = "10,10"







/*---------------------------------------------

Menu Orientation and Dimensions

---------------------------------------------*/



   //All values below are defined in pixel units.  Only the

   //width of items and menu groups may be defined, heights

   //are automatically determined by the font size and padding

   //values below.  See the menu_styles.css file for additional

   //border color and style settings.





  this.is_horizontal = false      //applies to all menu groups

  this.is_horizontal_main = true    //applies to main group only



  this.menu_width = 175        //applies to vertical menus

  this.menu_width_items = 120      //applies to items in a horizontal menu







   //Padding Values





  this.menu_padding_main = "0,0,0,0"    //top, right, bottom, left

  this.menu_padding_sub = "5,5,5,5"



  this.item_padding_main = "2,2,2,2"

  this.item_padding_sub = "3,5,3,0"







   //Border Sizing





  this.menu_border_main = 1

  this.menu_border_sub = 1



  this.item_border_main = 0

  this.item_border_sub = 0







   //Specific Item Setting Examples (change 'X' to appropriate index value)





  this.is_horizontalX = true



  this.menu_widthX = 200

  this.menu_width_itemsX = 100

  this.menu_width_itemX_X = 100



  this.menu_padding_subX = "10,5,10,5"

  this.item_padding_mainX = "10,5,10,5"

  this.item_padding_subX_X = "10,5,10,5"



  this.menu_border_subX = 1

  this.item_border_mainX = 1

  this.item_border_subX_X = 1







/*---------------------------------------------

Optional Style Sheet Class Name Association

---------------------------------------------*/



//Use the following section to optionally associate menu groups

//and menu items with existing CSS classes from your site.







   //global class names



  //this.main_menu_class = "myclassname"

  //this.main_items_class = "myclassname"

  //this.main_items_rollover_class = "myclassname"



  //this.sub_menu_class = "myclassname"

  //this.sub_items_class = "myclassname"

  //this.sub_items_rollover_class = "myclassname"





   //specific menu items



  //this.item_classX_X = "myclassname"

  //this.item_rollover_classX_X = "myclassname"







/*---------------------------------------------

Exposed Menu Events - Custom Script Attachment

---------------------------------------------*/





  this.show_menu = ""

  this.hide_menu = ""





 //available specific settings





  this.show_menuX = "alert('show id')"

  this.hide_menuX = "alert('hide id')"





  //use the following to execute a JavaScript statement for any menu item

  //change 'X' below, to the menu items index number.



  this.clickX = "alert('Sample Click Code - Exposed Menu Event')"







/*------------------------------------------------

Browser Workarounds

-------------------------------------------------*/





   //Opera 5 & 6 - alternate HTML display (Opera 7 displays menu 100%)



  this.opera_old_display_html = "Please update your opera browser.";







/*---------------------------------------------

Main Menu Group and Items

---------------------------------------------*/





   //Main Menu Group 0

  this.item0 = "Home"

  this.menu_width_item0 = 45

  this.item_padding_main0 = "2,2,2,5"

  this.url0 = "../../index.html"



  this.item1 = "About BNI"

  this.menu_width_item1 = 70

  this.item_padding_main1 = "2,2,2,5"

  this.url1 = "../../about.html"



      this.item2 = "Our Chapter"

  this.menu_width_item2 = 80

  this.item_padding_main2 = "2,2,2,5"

  this.url2 = "../../chapter.html"



  this.item3 = "Our Meeting"

  this.menu_width_item3 = 83

  this.item_padding_main3 = "2,2,2,5"

  this.url3 = "../../meeting.html"


  this.item4 = "Our Members"

  this.menu_width_item4 = 90

  this.item_padding_main4 = "2,2,2,5"

  this.url4 = "../../members.html"


  this.item5 = "Our Blog"

  this.menu_width_item5 = 70

  this.item_padding_main5 = "2,2,2,5"

  this.url5 = "../../blog.html"



}///////////////////////// END Menu Data /////////////////////////////////////////







