Quick question guys, if anyone knows..... I've inserted a Spry Menu Bar, and am trying to figure out how to make submenus appear when the user CLICKS on them as opposed to mouse hover to activate them.  I can do it with AP Div elements (by adding hide and show Behaviours when clicked), but can't work this one out.  Any help would be much appreciated.  Thanks  Stuart

In the SpryAssets folder there is a .js file.  I believe you can change the _onmouseover_ events to _onclick_ events in the _java_script__ file to accomplish this.  I'm not 100% sure where the exact line you are looking for is in that file though but if you post it over at the Spry forums someone might be able to tell you exactly what you are looking for:  http://www.adobe.com/go/labs_spry_pr1_forum

Hi, thanks for your reply. I looked for something like that, but the only line that mentions anything like that is towards the end where it says: this.addEventListener(listitem, 'mouseover', function(e)  I changed the 'mouseover' to '_onclick_' but this stopped the submenus from working at all.  This is the default SpryMenuBar.js code that is created when you add the menu bar for the first time. Any thoughts? /************************************************************************** *****   SpryMenuBar.js   This file handles the _java_script__ for Spry Menu Bar.  You should have no need   to edit this file.  Some highlights of the MenuBar _object_ is that timers are   used to keep submenus from showing up until the user has hovered over the parent   menu item for some time, as well as a timer for when they leave a submenu to keep   showing that submenu until the timer fires. *************************************************************************** ****/  var Spry;  if(!Spry)  {         Spry = {};  }  if(!Spry.Widget)  {         Spry.Widget = {};  }  // Constructor for Menu Bar  // element should be an ID of an unordered list (<ul tag)  // preloadImage1 and preloadImage2 are images for the rollover state of a menu  Spry.Widget.MenuBar = function(element, opts)  {         this.init(element, opts);  };  Spry.Widget.MenuBar.prototype.init = function(element, opts)  {         this.element = this.getElement(element);         // represents the current (sub)menu we are operating on         this.currMenu = null;         var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');         if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window._xml_HttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))         {                 // bail on older unsupported browsers                 return;         }         // load hover images now         if(opts)         {                 for(var k in opts)                 {                         var rollover = new Image;                         rollover.src = opts[k];                 }         }         if(this.element)         {                 this.currMenu = this.element;                 var items = this.element.getElementsByTagName('li');                 for(var i=0; i<items.length; i++)                 {                         this.initialize(items[i], element, isie);                         if(isie)                         {                                 this.addClassName(items[i], MenuBarItemIE );                                 items[i]._style_.position = static ;                         }                 }                 if(isie)                 {                         if(this.hasClassName(this.element, MenuBarVertical ))                         {                                 this.element._style_.position = relative ;                         }                         var _link_items = this.element.getElementsByTagName('a');                         for(var i=0; i<_link_items.length; i++)                         {                                 _link_items[i]._style_.position = relative ;                         }                 }         }  };  Spry.Widget.MenuBar.prototype.getElement = function(ele)  {         if (ele && typeof ele == string )                 return document.getElementById(ele);         return ele;  };  Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)  {         if (!ele || !className || !ele.className || ele.className.search(new RegExp( b + className + b )) == -1)         {                 return false;         }         return true;  };  Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)  {         if (!ele || !className || this.hasClassName(ele, className))                 return;         ele.className += (ele.className ? : ) + className;  };  Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)  {         if (!ele || !className || !this.hasClassName(ele, className))                 return;         ele.className = ele.className.replace(new RegExp( s*b + className + b , g ), );  };  // addEventListener for Menu Bar  // attach an event to a tag without creating obtrusive HTML code  Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)  {         try         {                 if (element.addEventListener)                 {                         element.addEventListener(eventType, handler, capture);                 }                 else if (element.attachEvent)                 {                         element.attachEvent('on' + eventType, handler);                 }         }         catch (e) {}  };  // create_i_frame___layer_ for Menu Bar  // creates an _i_frame__ underneath a menu so that it will show above form controls and ActiveX  Spry.Widget.MenuBar.prototype.create_i_frame___layer_ = function(menu)  {         var _layer_ = document.createElement('_i_frame__');         _layer_.tabIndex = '-1';         _layer_.src = '_java_script__:false;';         menu.parentNode.appendChild(_layer_);         _layer_._style_.left = menu.offsetLeft + 'px';         _layer_._style_.top = menu.offsetTop + 'px';         _layer_._style_.width = menu.offsetWidth + 'px';         _layer_._style_.height = menu.offsetHeight + 'px';  };  // remove_i_frame___layer_ for Menu Bar  // removes an _i_frame__ underneath a menu to reveal any form controls and ActiveX  Spry.Widget.MenuBar.prototype.remove_i_frame___layer_ =  function(menu)  {         var _layer_s = menu.parentNode.getElementsByTagName('_i_frame__');         while(_layer_s.length 0)         {                 _layer_s[0].parentNode.removeChild(_layer_s[0]);         }  };  // clearMenus for Menu Bar  // root is the top level unordered list (<ul tag)  Spry.Widget.MenuBar.prototype.clearMenus = function(root)  {         var menus = root.getElementsByTagName('ul');         for(var i=0; i<menus.length; i++)         {                 this.hideSubmenu(menus[i]);         }         this.removeClassName(this.element, MenuBarActive );  };  // bubbledTextEvent for Menu Bar  // identify bubbled up text events in Safari so we can ignore them  Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()  {         return (navigator.vendor == 'Apple Computer, Inc.' && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget)));  };  // showSubmenu for Menu Bar  // set the proper CSS class on this menu to show it  Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)  {         if(this.currMenu)         {                 this.clearMenus(this.currMenu);                 this.currMenu = null;         }         if(menu)         {                 this.addClassName(menu, MenuBarSubmenuVisible );                 if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')                 {                         if(!this.hasClassName(this.element, MenuBarHorizontal ) || menu.parentNode.parentNode != this.element)                         {                                 menu._style_.top = menu.parentNode.offsetTop + 'px';                         }                 }                 if(typeof document.uniqueID != undefined )                 {                         this.create_i_frame___layer_(menu);                 }         }         this.addClassName(this.element, MenuBarActive );  };  // hideSubmenu for Menu Bar  // remove the proper CSS class on this menu to hide it  Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)  {         if(menu)         {                 this.removeClassName(menu, MenuBarSubmenuVisible );                 if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')                 {                         menu._style_.top = '';                         menu._style_.left = '';                 }                 this.remove_i_frame___layer_(menu);         }  };  // initialize for Menu Bar  // create event listeners for the Menu Bar widget so we can properly  // show and hide submenus  Spry.Widget.MenuBar.prototype.initialize = function(listitem, element, isie)  {         var opentime, closetime;         var _link_ = listitem.getElementsByTagName('a')[0];         var submenus = listitem.getElementsByTagName('ul');         var menu = (submenus.length 0 ? submenus[0] : null);         var hasSubMenu = false;         if(menu)         {                 this.addClassName(_link_, MenuBarItemSubmenu );                 hasSubMenu = true;         }         if(!isie)         {                 // define a simple function that comes standard in IE to determine                 // if a node is within another node                 listitem.contains = function(testNode)                 {                         // this refers to the list item                         if(testNode == null)                         {                                 return false;                         }                         if(testNode == this)                         {                                 return true;                         }                         else                         {                                 return this.contains(testNode.parentNode);                         }                 };         }         // need to save this for scope further down         var self = this;         this.addEventListener(listitem, 'mouseover', function(e)         {                 if(self.bubbledTextEvent())                 {                         // ignore bubbled text events                         return;                 }                 clearTimeout(closetime);                 if(self.currMenu == listitem)                 {                         self.currMenu = null;                 }                 // show menu highlighting                 self.addClassName(_link_, hasSubMenu ? MenuBarItemSubmenuHover : MenuBarItemHover );                 if(menu && !self.hasClassName(menu, MenuBarSubmenuVisible ))                 {                         opentime = window.setTimeout(function(){self.showSubmenu(menu);}, 250);                 }         }, false);         this.addEventListener(listitem, 'mouseout', function(e)         {                 if(self.bubbledTextEvent())                 {                         // ignore bubbled text events                         return;                 }                 var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);                 if(!listitem.contains(related))                 {                         clearTimeout(opentime);                         self.currMenu = listitem;                         // remove menu highlighting                         self.removeClassName(_link_, hasSubMenu ? MenuBarItemSubmenuHover : MenuBarItemHover );                         if(menu)                         {                                 closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);                         }                 }         }, false);  };

I've added a spry menu bar to my navbar, I set it up with the submenu and the _link_s and so on.  I got it to look more or less just how I wanted it to except for a few minor details but when I go to view it in the browser I have the main menu choice with the to show there's more (the submenu choices) but it doesn't open up.  I played around with it because I figured the main menu choice I'd like to have open just by hovering over it and the submenu _link_s to open by clicking on them....no luck.  I'm sure it's something simple that I'm missing and/or forgetting to do, I do have web design experience but it's all been with FrontPage - I've obviously now upgraded to Dreamweaver!  If anybody could help or offer any suggestions I'd appreciate it.  Thank you.