Jump to content

Drop down menu issues.

ActaNonVerba1

By ActaNonVerba1
in Javascript Help

 Share

Recommended Posts

ActaNonVerba1 Member

ActaNonVerba1

Posted
Posted

:wtf: :wtf: :wtf: :wtf: :wtf: :wtf: :wtf: :wtf:

 

Hey guys

 

I'm suing Dreamweavers Spry menubar, and it was working but now it isnt. Any help?

 

HTML

<!DOCTYPE html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Types of Guitar</title>

<link rel="stylesheet" type="text/css" href="style.css"/>

<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

<script>

whiteSection = document.getElementById("body_wrap");

</script>

<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

</head>

<body>

<div id="top_bar"><CENTER>

<FORM>

<span class="style2"><strong><br>Background colour:	</strong></span> 

<SELECT name="ccGround" size="1" onChange=(document.getElementById('top_text').style.background=ccGround.options[ccGround.selectedIndex].value)>

<OPTION value="#408080" target="1">Cool Green	</OPTION>

<OPTION value="#C0C0C0" target="1">Cool Grey	</OPTION>

<OPTION value="#000000" target="1">Black	</OPTION>

<OPTION value="#730200" target="1">DarkRed	</OPTION>

<OPTION value="#231800" target="1">Brown	</OPTION>

<OPTION value="#044302" target="1">DarkGreen	</OPTION>

<OPTION value="#0D09A3" target="1">Dark Blue	</OPTION>

<OPTION value="#808040" target="1">Avocado	</OPTION>

<OPTION value="#800080" target="1">Purple	</OPTION>

<OPTION value="#444444" target="1">Grey	</OPTION>

<OPTION value="#FF0400" target="1">Red	</OPTION>

<OPTION value="#EFE800" target="1">Yellow	</OPTION>

<OPTION value="#05EF00" target="1">Green	</OPTION>

<OPTION value="#0206FF" target="1">Blue	</OPTION>

<OPTION value="#AE08EF" target="1">Violet	</OPTION>

<OPTION value="#FF8C8A" target="1">Mauve	</OPTION>

<OPTION value="#FF80FF" target="1">Pink	</OPTION>

<OPTION value="#FFCCCC" target="1">Peach	</OPTION>

<OPTION value="#FFCC99" target="1">Orange	</OPTION>

<OPTION value="#000080" target="1">Darker Blue	</OPTION>

<OPTION value="#808080" target="1">Dark Grey	</OPTION>

<OPTION value="#D5CCBB" target="1">Tan	</OPTION>

<OPTION value="#DDDDDD" target="1" selected>Light Grey	</OPTION>

<OPTION value="#FBFF73" target="1">Light Yellow	</OPTION>

<OPTION value="#7CFF7D" target="1">Light Green	</OPTION>

<OPTION value="#A6BEFF" target="1">Light Blue	</OPTION>

<OPTION value="#FFFFFF" target="1">White	</OPTION>

</SELECT></FORM>

</CENTER>





<CENTER><a href="javascript:void(0);" onClick="javascript:body.style.fontSize='.5em'"><span style="font-size: xx-small;">Small</span></a>

<a href="javascript:void(0);" onClick="javascript:body.style.fontSize='1em'"><span style="font-size: x-small;">Medium</span></a>

<a href="javascript:void(0);" onClick="javascript:body.style.fontSize='1.5em'"><span style="font-size: small;">Large</span></a>

<a href="javascript:void(0);" onClick="javascript:body.style.fontSize='2em'"><span style="font-size: large;">Larger</span></a>

<a href="javascript:void(0);" onClick="javascript:body.style.fontSize='2.5em'"><span style="font-size: x-large;">Largest</span></a></p></CENTER>



<script type="text/javascript">

var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});

</script></div>

<div id="header"><img src="images/header.png" alt="Harry's Guitar Tips"></div>

<div id="navigation">

  <ul id="MenuBar1" class="MenuBarHorizontal">

    <li><a href="web pages/index.html">Home</a>      </li>

    <li><a href="#" class="MenuBarItemSubmenu">Info</a>

      <ul>

        <li><a href="web pages/types_of_guitar.html">Types of Guitar</a></li>

        <li><a href="web pages/types_of_amp.html">Types of Amp</a></li>

        <li><a href="web pages/guitar_equipment.html">Guitar Equipment</a></li>

        <li><a href="web pages/changing_strings.html">Changing Strings</a></li>

      </ul>

    </li>

    <li><a class="MenuBarItemSubmenu" href="#">Beginner</a>

      <ul>

        <li><a href="web pages/getting_started.html">Getting Started</a>          </li>

        <li><a href="web pages/chords.html">Chords</a></li>

</ul>

    </li>

    <li><a href="#" class="MenuBarItemSubmenu">Intermediate</a>

      <ul>

        <li><a href="web pages/legato.html">Legato</a></li>

        <li><a href="web pages/string_bending.html">String Bending</a></li>

        <li><a href="web pages/power_chords.html">Power Chords</a></li>

      </ul>

    </li>

    <li><a href="web pages/feedback.html">Feedback</a></li></ul></div>

<div id="body_wrap">



  <div id="top_text">

    <p><span class="header">Types of Amp</span>

      <span class="body_text">

      <br>

      <br>

      </span></p>

    <div id="text">

      <span class="subheader">

      Valve (tube) amps</span><span class="body_text">

      <br>

      <br>

       Valve amps do exactly as the name implies: they use valves to amplify the electronic signal produced from an electric guitar and output a sound through a speaker. <br>

        <br>

        Advantages of valve amps:

        <br>

        <br>

        •	They are generally thought of as having the best sound out of all types of amps

        <br>

        <br>

        •	Valve amps produce a much louder sound using less power than solid-state amps. Helpful for playing live although not if you have neighbours!

        <br>

        <br>

          Disadvantages:

          <br>

          <br>

          •	Valve amps are much more expensive than other types of amp.

          <br>

          <br>

          •	They are much heavier than other types of amp so are hard to transport.

          <br>

          <br>

          •	They are relatively fragile.

       </span>

      <span class="subheader">

  <br>

  <br>

  <br>



  

        Solid State Amps</span><span class="body_text">

  <br>

  <br>

  <br>

Solid state amps use microprocessors rather than valves to amplify the sound of the guitar. The intention of solid-state amps is often to try to mimic the sound of valve amps and although in some cases they can come close, solid state amps generally do not sound like valve amps. <br><br>

Advantages of solid state amps:

<br>

<br>

•	Much more reliable than valve amps.

<br>

  <br>

•	Very cheap compared to alternatives.

        <br>

        <br>

•	Can produce many different sounds from one amp.

<br>

<br>

Disadvantages:

<br>

<br>

•	Require a lot of power to reach high volumes so not particularly helpful when gigging.

<br>

<br>

•	They have a cold, artificial sound that is often not very desirable to guitarists.



</span>

  <span class="subheader">

  <br>

  <br>

  <br>

   Hybrid Amps</span>

  <span class="body_text">

  <br>

  <br>

  <br>

An amp is made up of both a pre-amp (the part that prepares the electronic signal for further processing) and an output stage. A hybrid amp has one of these components being run by a valve and the other being solid-state.

  <br>

  <br>

Advantages of hybrid amps:

<br>

<br>

•	Hybrid amps sound closer to full valve amps than solid-state amps.

<br>

<br>

•	Cheaper than valve amps.

<br>

<br>

Disadvantages:

<br>

<br>

•	Because hybrid amps use valves they are fragile.

<br>

<br></span>





</div>

<div id="images">

<img src="images/Components/images/valve_amp_head.png" width="90" height="200">

<br>

<br>

<br>

<img src="images/Components/images/hybrid_amp.png" width="130" height="133">

<br>

<br>

<br>

<img src="images/Components/images/electro_acoustic.png" width="90" height="180">



</div>

</div>



  <div id="body_region">



<div id="body">



</div>



</div>



</div>



</body>

</html>

JS

// SpryMenuBar.js - version 0.13 - 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.

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

(function() { // BeginSpryComponent

if (typeof Spry == "undefined") window.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 (<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;
this.showDelay = 250;
this.hideDelay = 600;
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<items.length; 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.length; 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 (<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, 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);

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];
}
};

})(); // EndSpryComponent

Link to comment
https://forums.phpfreaks.com/topic/231881-drop-down-menu-issues/
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.