Creative COW SIGN IN :: SPONSORS :: ADVERTISING :: ABOUT US :: CONTACT US :: FAQ
Creative COW's LinkedIn GroupCreative COW's Facebook PageCreative COW on TwitterCreative COW's Google+ PageCreative COW on YouTube
ADOBE DREAMWEAVER:HomeDreamweaver ForumDreamweaver TutorialsFAQAdobe FlashWeb Design

reset spry menu

COW Forums : Adobe Dreamweaver

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Share on Facebook
Richard Williamsreset spry menu
by on Jan 27, 2009 at 10:33:47 pm

Hi All,

Just a quicky...

Does anyone know how i can set my spry menu up to reset on select?

Because i am using an iframe and large images, the problem is that when you click on a link, the spry stays until you roll off, i would like to reset on click if possible...?

http://www.ms-solutions.co.uk/holly



Richard Williams


Return to posts index
Reply   Like  

Richard WilliamsRe: reset spry menu
by on Jan 28, 2009 at 8:16:10 pm

ok then Gents (Abraham and Fernando)
If not this, how about moving the mouse cursor on click as an action...? Is it possible?

Richard Williams


Return to posts index
Reply   Like  


cowcowcowcowcow
Abraham ChaffinRe: reset spry menu
by on Jan 28, 2009 at 9:19:43 pm

Yea this is doable. You'll just need to hack the javascript file a bit. Go into the javascript file and look for the block of code that looks like this:

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);


This is the block of code that tells the list item to go away when you mouse out of the list item. Take that code - copy and paste it right below it and change the line 'mouseout' to 'click'. You basically have made another listener that will listen for the click and have it do the same thing it would do when you mouse out.

Additionally there is a line that says:

closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);


I would change that 600 to like a 100 for the click timeout so it doesn't hang very long after you click.


Abraham


Return to posts index
Reply   Like  
+1


Richard WilliamsRe: reset spry menu
by on Jan 28, 2009 at 9:58:24 pm

Hi Abraham...

thanks, can you please just check your version of js? Mine does not match what you have put here...?

Richard Williams


Return to posts index
Reply   Like  

Abraham ChaffinRe: reset spry menu
by on Jan 28, 2009 at 10:00:45 pm

Post your javascript code and I'll take a look at it. I am still using CS3.

Abraham


Return to posts index
Reply   Like  

Richard WilliamsRe: reset spry menu
by on Jan 28, 2009 at 10:17:25 pm

lol... yeh me too, but my spry version i think must be different...

Anyway, i think i sussed it from what you wrote, it seems to work.

http://www.ms-solutions.co.uk/holly

Here comes the code for the js that i have...

Thanks Alot BTW... I love it when you make me feel so inept, it makes me feel privelidged to be in the company of greatness!



// SpryMenuBar.js - version 0.12 - Spry Pre-Release 1.6.1
//
// Copyright (c) 2006. Adobe Systems Incorporated.
// All rights reserved.
//
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are met:
//
// * Redistributions of source code must retain the above copyright notice,
// this list of conditions and the following disclaimer.
// * Redistributions in binary form must reproduce the above copyright notice,
// this list of conditions and the following disclaimer in the documentation
// and/or other materials provided with the distribution.
// * Neither the name of Adobe Systems Incorporated nor the names of its
// contributors may be used to endorse or promote products derived from this
// software without specific prior written permission.
//
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
// POSSIBILITY OF SUCH DAMAGE.

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

SpryMenuBar.js
This file handles the JavaScript 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 = {};

Spry.BrowserSniff = function()
{
var b = navigator.appName.toString();
var up = navigator.platform.toString();
var ua = navigator.userAgent.toString();

this.mozilla = this.ie = this.opera = this.safari = false;
var re_opera = /Opera.([0-9.]*)/i;
var re_msie = /MSIE.([0-9.]*)/i;
var re_gecko = /gecko/i;
var re_safari = /(applewebkit|safari)/([d.]*)/i;
var r = false;

if ( (r = ua.match(re_opera))) {
this.opera = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_msie))) {
this.ie = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_safari))) {
this.safari = true;
this.version = parseFloat(r[2]);
} else if (ua.match(re_gecko)) {
var re_gecko_version = /rv:s*([0-9.]+)/i;
r = ua.match(re_gecko_version);
this.mozilla = true;
this.version = parseFloat(r[1]);
}
this.windows = this.mac = this.linux = false;

this.Platform = ua.match(/windows/i) ? "windows" :
(ua.match(/linux/i) ? "linux" :
(ua.match(/mac/i) ? "mac" :
ua.match(/unix/i)? "unix" : "unknown"));
this[this.Platform] = true;
this.v = this.version;

if (this.safari && this.mac && this.mozilla) {
this.mozilla = false;
}
};

Spry.is = new Spry.BrowserSniff();

// Constructor for Menu Bar
// element should be an ID of an unordered list (
    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;
    this.showDelay = 250;
    this.hideDelay = 250;
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
    {
    // bail on older unsupported browsers
    return;
    }

    // Fix IE6 CSS images flicker
    if (Spry.is.ie && Spry.is.version < 7){
    try {
    document.execCommand("BackgroundImageCache", false, true);
    } catch(err) {}
    }

    this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
    this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
    this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
    this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
    this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;

    this.hoverClass = 'MenuBarItemHover';
    this.subHoverClass = 'MenuBarItemSubmenuHover';
    this.subVisibleClass ='MenuBarSubmenuVisible';
    this.hasSubClass = 'MenuBarItemSubmenu';
    this.activeClass = 'MenuBarActive';
    this.isieClass = 'MenuBarItemIE';
    this.verticalClass = 'MenuBarVertical';
    this.horizontalClass = 'MenuBarHorizontal';
    this.enableKeyboardNavigation = true;

    this.hasFocus = false;
    // load hover images now
    if(opts)
    {
    for(var k in opts)
    {
    if (typeof this[k] == 'undefined')
    {
    var rollover = new Image;
    rollover.src = opts[k];
    }
    }
    Spry.Widget.MenuBar.setOptions(this, opts);
    }

    // safari doesn't support tabindex
    if (Spry.is.safari)
    this.enableKeyboardNavigation = false;

    if(this.element)
    {
    this.currMenu = this.element;
    var items = this.element.getElementsByTagName('li');
    for(var i=0; i {
    if (i > 0 && this.enableKeyboardNavigation)
    items[i].getElementsByTagName('a')[0].tabIndex='-1';

    this.initialize(items[i], element);
    if(Spry.is.ie)
    {
    this.addClassName(items[i], this.isieClass);
    items[i].style.position = "static";
    }
    }
    if (this.enableKeyboardNavigation)
    {
    var self = this;
    this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
    }

    if(Spry.is.ie)
    {
    if(this.hasClassName(this.element, this.verticalClass))
    {
    this.element.style.position = "relative";
    }
    var linkitems = this.element.getElementsByTagName('a');
    for(var i=0; i {
    linkitems[i].style.position = "relative";
    }
    }
    }
    };
    Spry.Widget.MenuBar.KEY_ESC = 27;
    Spry.Widget.MenuBar.KEY_UP = 38;
    Spry.Widget.MenuBar.KEY_DOWN = 40;
    Spry.Widget.MenuBar.KEY_LEFT = 37;
    Spry.Widget.MenuBar.KEY_RIGHT = 39;

    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) {}
    };

    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    {
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:""';
    layer.frameBorder = '0';
    layer.scrolling = 'no';
    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';
    };

    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer = function(menu)
    {
    var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
    while(layers.length > 0)
    {
    layers[0].parentNode.removeChild(layers[0]);
    }
    };

    // clearMenus for Menu Bar
    // root is the top level unordered list (
      tag)
      Spry.Widget.MenuBar.prototype.clearMenus = function(root)
      {
      var menus = root.getElementsByTagName('ul');
      for(var i=0; i this.hideSubmenu(menus[i]);

      this.removeClassName(this.element, this.activeClass);
      };

      // bubbledTextEvent for Menu Bar
      // identify bubbled up text events in Safari so we can ignore them
      Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
      {
      return Spry.is.safari && (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, this.subVisibleClass);
      if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
      {
      if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
      {
      menu.style.top = menu.parentNode.offsetTop + 'px';
      }
      }
      if(Spry.is.ie && Spry.is.version < 7)
      {
      this.createIframeLayer(menu);
      }
      }
      this.addClassName(this.element, this.activeClass);
      };

      // 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, this.subVisibleClass);
      if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
      {
      menu.style.top = '';
      menu.style.left = '';
      }
      if(Spry.is.ie && Spry.is.version < 7)
      this.removeIframeLayer(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)
      {
      var opentime, closetime;
      var link = listitem.getElementsByTagName('a')[0];
      var submenus = listitem.getElementsByTagName('ul');
      var menu = (submenus.length > 0 ? submenus[0] : null);

      if(menu)
      this.addClassName(link, this.hasSubClass);

      if(!Spry.is.ie)
      {
      // 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){self.mouseOver(listitem, e);}, false);
      this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
      this.addEventListener(listitem, 'click', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);

      if (this.enableKeyboardNavigation)
      {
      this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
      this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
      }
      };
      Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
      {
      this.lastOpen = listitem.getElementsByTagName('a')[0];
      this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
      this.hasFocus = true;
      };
      Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
      {
      this.clearSelection(listitem);
      };
      Spry.Widget.MenuBar.prototype.clearSelection = function(el){
      //search any intersection with the current open element
      if (!this.lastOpen)
      return;

      if (el)
      {
      el = el.getElementsByTagName('a')[0];

      // check children
      var item = this.lastOpen;
      while (item != this.element)
      {
      var tmp = el;
      while (tmp != this.element)
      {
      if (tmp == item)
      return;
      try{
      tmp = tmp.parentNode;
      }catch(err){break;}
      }
      item = item.parentNode;
      }
      }
      var item = this.lastOpen;
      while (item != this.element)
      {
      this.hideSubmenu(item.parentNode);
      var link = item.getElementsByTagName('a')[0];
      this.removeClassName(link, this.hoverClass);
      this.removeClassName(link, this.subHoverClass);
      item = item.parentNode;
      }
      this.lastOpen = false;
      };
      Spry.Widget.MenuBar.prototype.keyDown = function (e)
      {
      if (!this.hasFocus)
      return;

      if (!this.lastOpen)
      {
      this.hasFocus = false;
      return;
      }

      var e = e|| event;
      var listitem = this.lastOpen.parentNode;
      var link = this.lastOpen;
      var submenus = listitem.getElementsByTagName('ul');
      var menu = (submenus.length > 0 ? submenus[0] : null);
      var hasSubMenu = (menu) ? true : false;

      var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];

      if (!opts[3])
      opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;

      var found = 0;
      switch (e.keyCode){
      case this.upKeyCode:
      found = this.getElementForKey(opts, 'y', 1);
      break;
      case this.downKeyCode:
      found = this.getElementForKey(opts, 'y', -1);
      break;
      case this.leftKeyCode:
      found = this.getElementForKey(opts, 'x', 1);
      break;
      case this.rightKeyCode:
      found = this.getElementForKey(opts, 'x', -1);
      break;
      case this.escKeyCode:
      case 9:
      this.clearSelection();
      this.hasFocus = false;
      default: return;
      }
      switch (found)
      {
      case 0: return;
      case 1:
      //subopts
      this.mouseOver(listitem, e);
      break;
      case 2:
      //parent
      this.mouseOut(opts[2], e);
      break;
      case 3:
      case 4:
      // left - right
      this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
      break;
      }
      var link = opts[found].getElementsByTagName('a')[0];
      if (opts[found].nodeName.toLowerCase() == 'ul')
      opts[found] = opts[found].getElementsByTagName('li')[0];

      this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
      this.lastOpen = link;
      opts[found].getElementsByTagName('a')[0].focus();

      //stop further event handling by the browser
      return Spry.Widget.MenuBar.stopPropagation(e);
      };
      Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
      {
      var link = listitem.getElementsByTagName('a')[0];
      var submenus = listitem.getElementsByTagName('ul');
      var menu = (submenus.length > 0 ? submenus[0] : null);
      var hasSubMenu = (menu) ? true : false;
      if (this.enableKeyboardNavigation)
      this.clearSelection(listitem);

      if(this.bubbledTextEvent())
      {
      // ignore bubbled text events
      return;
      }

      if (listitem.closetime)
      clearTimeout(listitem.closetime);

      if(this.currMenu == listitem)
      {
      this.currMenu = null;
      }

      // move the focus too
      if (this.hasFocus)
      link.focus();

      // show menu highlighting
      this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
      this.lastOpen = link;
      if(menu && !this.hasClassName(menu, this.subHoverClass))
      {
      var self = this;
      listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
      }
      };
      Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
      {
      var link = listitem.getElementsByTagName('a')[0];
      var submenus = listitem.getElementsByTagName('ul');
      var menu = (submenus.length > 0 ? submenus[0] : null);
      var hasSubMenu = (menu) ? true : false;
      if(this.bubbledTextEvent())
      {
      // ignore bubbled text events
      return;
      }

      var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
      if(!listitem.contains(related))
      {
      if (listitem.opentime)
      clearTimeout(listitem.opentime);
      this.currMenu = listitem;

      // remove menu highlighting
      this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
      if(menu)
      {
      var self = this;
      listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
      }
      if (this.hasFocus)
      link.blur();
      }
      };
      Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
      {
      var child = element[sibling];
      while (child && child.nodeName.toLowerCase() !='li')
      child = child[sibling];

      return child;
      };
      Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
      {
      var found = 0;
      var rect = Spry.Widget.MenuBar.getPosition;
      var ref = rect(els[found]);

      var hideSubmenu = false;
      //make the subelement visible to compute the position
      if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
      {
      els[1].style.visibility = 'hidden';
      this.showSubmenu(els[1]);
      hideSubmenu = true;
      }

      var isVert = this.hasClassName(this.element, this.verticalClass);
      var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;

      for (var i = 1; i < els.length; i++){
      //when navigating on the y axis in vertical menus, ignore children and parents
      if(prop=='y' && isVert && (i==1 || i==2))
      {
      continue;
      }
      //when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
      if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
      {
      continue;
      }

      if (els[i])
      {
      var tmp = rect(els[i]);
      if ( (dir * tmp[prop]) < (dir * ref[prop]))
      {
      ref = tmp;
      found = i;
      }
      }
      }

      // hide back the submenu
      if (els[1] && hideSubmenu){
      this.hideSubmenu(els[1]);
      els[1].style.visibility = '';
      }

      return found;
      };
      Spry.Widget.MenuBar.camelize = function(str)
      {
      if (str.indexOf('-') == -1){
      return str;
      }
      var oStringList = str.split('-');
      var isFirstEntry = true;
      var camelizedString = '';

      for(var i=0; i < oStringList.length; i++)
      {
      if(oStringList[i].length>0)
      {
      if(isFirstEntry)
      {
      camelizedString = oStringList[i];
      isFirstEntry = false;
      }
      else
      {
      var s = oStringList[i];
      camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
      }
      }
      }

      return camelizedString;
      };

      Spry.Widget.MenuBar.getStyleProp = function(element, prop)
      {
      var value;
      try
      {
      if (element.style)
      value = element.style[Spry.Widget.MenuBar.camelize(prop)];

      if (!value)
      if (document.defaultView && document.defaultView.getComputedStyle)
      {
      var css = document.defaultView.getComputedStyle(element, null);
      value = css ? css.getPropertyValue(prop) : null;
      }
      else if (element.currentStyle)
      {
      value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
      }
      }
      catch (e) {}

      return value == 'auto' ? null : value;
      };
      Spry.Widget.MenuBar.getIntProp = function(element, prop)
      {
      var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
      if (isNaN(a))
      return 0;
      return a;
      };

      Spry.Widget.MenuBar.getPosition = function(el, doc)
      {
      doc = doc || document;
      if (typeof(el) == 'string') {
      el = doc.getElementById(el);
      }

      if (!el) {
      return false;
      }

      if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
      //element must be visible to have a box
      return false;
      }

      var ret = {x:0, y:0};
      var parent = null;
      var box;

      if (el.getBoundingClientRect) { // IE
      box = el.getBoundingClientRect();
      var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
      var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
      ret.x = box.left + scrollLeft;
      ret.y = box.top + scrollTop;
      } else if (doc.getBoxObjectFor) { // gecko
      box = doc.getBoxObjectFor(el);
      ret.x = box.x;
      ret.y = box.y;
      } else { // safari/opera
      ret.x = el.offsetLeft;
      ret.y = el.offsetTop;
      parent = el.offsetParent;
      if (parent != el) {
      while (parent) {
      ret.x += parent.offsetLeft;
      ret.y += parent.offsetTop;
      parent = parent.offsetParent;
      }
      }
      // opera & (safari absolute) incorrectly account for body offsetTop
      if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
      ret.y -= doc.body.offsetTop;
      }
      if (el.parentNode)
      parent = el.parentNode;
      else
      parent = null;
      if (parent.nodeName){
      var cas = parent.nodeName.toUpperCase();
      while (parent && cas != 'BODY' && cas != 'HTML') {
      cas = parent.nodeName.toUpperCase();
      ret.x -= parent.scrollLeft;
      ret.y -= parent.scrollTop;
      if (parent.parentNode)
      parent = parent.parentNode;
      else
      parent = null;
      }
      }
      return ret;
      };

      Spry.Widget.MenuBar.stopPropagation = function(ev)
      {
      if (ev.stopPropagation)
      ev.stopPropagation();
      else
      ev.cancelBubble = true;
      if (ev.preventDefault)
      ev.preventDefault();
      else
      ev.returnValue = false;
      };

      Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
      {
      if (!optionsObj)
      return;
      for (var optionName in optionsObj)
      {
      if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
      continue;
      obj[optionName] = optionsObj[optionName];
      }
      };


      Richard Williams


Return to posts index
Reply   Like  


Abraham ChaffinRe: reset spry menu
by on Jan 28, 2009 at 10:25:34 pm

Right on - looks like you got it working anyway.

Abraham


Return to posts index
Reply   Like  

Richard WilliamsRe: reset spry menu
by on Jan 28, 2009 at 10:49:38 pm

yeh, just need to think of something a bit differnt with the top of the spry rollover images then i'll be happy... i think i am doing this a bit of a silly way perhaps...

Anyway, Much appreciated Abraham as always, its been a while since i needed you.

Richard Williams


Return to posts index
Reply   Like  

Richard EvansRe: reset spry menu
by on Jan 30, 2009 at 2:29:08 pm

HI guys,

Im very new to the forum, Ive been searching for an answer to the problem I have with the DWCS3 Horizontal Spry and wondered if you can help, Im pretty new to DW too and not a heavy coder. I understand the concept of adding spry's and then the CSS to style the indiviual parts of the spry, however the problem I have is when I insert the Horizontal spry to create a < div > (wrap around selected) the spry looks just as the < ul > list (a sort of tree or site map-like?) it doesnt display in design view as a spry? Also this doesnt seem to affect the Vertical Spry ??

Am I missing something??

Many thanks in advance for your help or some advice

Richie



Return to posts index
Reply   Like  


Abraham ChaffinRe: reset spry menu
by on Jan 30, 2009 at 2:42:24 pm

Your horizontal spry css file. "SpryMenuBarHorizontal.css" is probably not in the correct location. Try copying this file into your SpryAssets folder if it is not already there. If this doesn't work you might post a link to your site and we'll take a look.

Abraham


Return to posts index
Reply   Like  

Richard EvansRe: reset spry menu
by on Jan 30, 2009 at 2:48:05 pm

Thanks Abraham,

Will be having a look later and may need some further assistance.

Many thanks for the speedy reply.

Richie



Return to posts index
Reply   Like  

Richard EvansRe: reset spry menu
by on Jan 31, 2009 at 9:11:52 pm

Hey Abraham,

Many thanks for your advice, seems that sorted the problem out.

Really like the site & forums, great tutorials too, your CSS tutorial is so easy to follow.

Again many thanks

Richie



Return to posts index
Reply   Like  


mikael eliassonRe: reset spry menu
by on Jun 26, 2009 at 3:00:47 pm

Hi
trying to edit a vertical spry menu bar
once the menu has been activated (set to click) i want it to stay open until another menu is clicked. Is this possible?

Also,
i want the sub menus to all start at the top of the page rather than below their parent if poss.

ie
item 1 item 3.1 item 3.1.1
item 2 item 3.2 item 3.1.2
item 3 item 3.3
item 4 item 3.4
item 3.5


finally...
is it possible to activate a menu (ul horizontal - not spry) by click and after it has been activated it is controlled by hover, like in normal menus of applications

cheers

mikael


Return to posts index
Reply   Like  

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
Share on Facebook


FORUMSTUTORIALSFEATURESVIDEOSPODCASTSEVENTSSERVICESNEWSLETTERNEWSBLOGS

Creative COW LinkedIn Group Creative COW Facebook Page Creative COW on Twitter
© 2014 CreativeCOW.net All rights are reserved. - Privacy Policy

[Top]