Horizontal submenus Spry drop not vertical
Please forgive me if there's a post answering the question of ths. I went through about 20 posts and 2 tutorials that I thought that it would process without success. I use CS4 with Vista and ie7, I thought that my problem was the Flash video as the menu, but the problem still exists when I deleted the flash.
I inserted a horizontal Spry menu with submenus, but the submenus drop horizontal and not vertical. (In the design of the menu display has a vertical drop). Take a look at the first and the third link for an example. http://gigharborrealestate.com/dw_question/
Thank you
The problem lies here:
ul.MenuBarHorizontal ul { margin: 0; padding: 0; list-style-type: none; font-size: 100%; z-index: 1020; cursor: default; width: auto; position: absolute; left: -1000em; }
You must assign a width for submenus. Otherwise, IE display these files directly horizontally.
Tags: Dreamweaver
Similar Questions
-
Horizontal submenu Spry does not hide in Internet Explorer
My submenus horizontal spry remain displayed in Internet Explorer. What I would do.
I use vista with DW cs3.
JamesSee what has been changed, it's hard to say. A suggestion I can do without seeing the code must make sure that your Spry is up to date. To find your current version of Spry, review the sections file in the SpryAssets folder. At the top it will say "sections - version 0. # - Spry pre-release 1. #. # »
If you are running version 0.6; Pre-release 1.6.1 so that you do not use the latest version. If this is the case manager on the site below which is the official website of Spry. You will find a link to the official forums of Spry and Spry update package. Inside this package is a bunch of samples, demos and an Extension. Install the extension, and then restart DW. Once restarted, under the Sites menu, you will see a new option to update Spry. Click on this and your Spry will be updated to the latest version.
If you're still having problems after doing this, you'll need to be a link to your page or the code of your page so that we can see what you have changed the Spry script.
-
CS4 MENU HORIZONTAL SPRY DOES NOT WORK IN IE 8
I had problems with the drop-down list of CS4 so I decided to create a clean HTML page and start from scratch. I created a new HTML page with nothing else than a horizontal menu spry, but it does not work in IE 8. Drop-down menus do not show. Nothing has been changed in all included files in DW, but I copied and pasted below.
Any help would be greatly appreciated.
HTML:
< ! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional / / IN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > ""
" < html xmlns =" http://www.w3.org/1999/xhtml ">
< head >
< meta http-equiv = "Content-Type" content = text/html"; charset = utf-8 "/ >"
< title > Untitled Document < /title >
< script src = "SpryAssets/SpryMenuBar.js" type = "text/javascript" > < / script > "
< link href = "SpryAssets/SpryMenuBarHorizontal.css" rel = "stylesheet" type = "text/css" / > "
< / head >< body >
< ul id = "MenuBar1" class = "MenuBarHorizontal" >
< li > < a class = "MenuBarItemSubmenu" href = "#" > item 1 < /a >
< ul >
< li > < a href = "#" > 1.1 < /a > < /li >
< li > < a href = "#" > 1.2 < /a > < /li >
< li > < a href = "#" > question 1.3 < /a > < /li >
< /ul >
< /li >
< li > < a href = "#" > item 2 < /a > < /li >
< li > < a class = "MenuBarItemSubmenu" href = "#" > point 3 < /a >
< ul >
< li > < a class = "MenuBarItemSubmenu" href = "#" > point 3.1 < /a >
< ul >
< li > < a href = "#" > section 3.1.1 < /a > < /li >
< li > < a href = "#" > 3.1.2 < /a > < /li >
< /ul >
< /li >
< li > < a href = "#" > point 3.2 < /a > < /li >
< li > < a href = "#" > point 3.3 < /a > < /li >
< /ul >
< /li >
< li > < a href = "#" > point 4 < /a > < /li >
< /ul >
< script type = "text/javascript" >
<!--
var MenuBar1 = new Spry.Widget.MenuBar ("MenuBar1", {imgDown: "SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});})
->
< /script >
< / body >
< / html >@charset "UTF-8";
/ * Sections - version 0.6 - Pre - Release Spry 1.6.1 * /.
/ * Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/*******************************************************************************
The AVAILABLE INFORMATION: Describes the box model, positioning, the order
*******************************************************************************/
/ * The outermost container for the menu bar, an area of width auto without margin or padding * /.
UL. MenuBarHorizontal
{
margin: 0;
padding: 0;
list-style-type: none;
do-size: 100%;
cursor: default;
Width: auto;
}
/ * Value of the menu bar active with this class, currently the definition of z-index to accommodate IE rendering bugs: http://therealcrisp.xs4all.nl/Meuk/IE-zindexbug.html */
UL. MenuBarActive
{
z-index: 1000;
}
/ * Menu item containers, position of children relative to this container and are a fixed width * /.
UL. MenuBarHorizontal li
{
margin: 0;
padding: 0;
list-style-type: none;
do-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
Width: 8th;
float: left;
}
/ * Submenus should appear under their parent (top: 0) with a higher z-index, but they are first the left side of the screen (-1000em) * /.
UL. MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
do-size: 100%;
z index: 1020;
cursor: default;
Width: 8.2em;
position: absolute;
left:-1000em;
}
/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we put the car left so it happens on the screen below its parent menu item * /.
UL. MenuBarHorizontal ul. MenuBarSubmenuVisible
{
left: auto;
}
/ * Container of menu items are same fixed width parent * /.
UL. MenuBarHorizontal ul li
{
Width: 8.2em;
}
/ * Submenus should appear slightly overlapping to the right (95%) and upward (-5%) * /.
UL. MenuBarHorizontal ul ul
{
position: absolute;
margin:-5% 0 0 95%;
}
/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we have left to 0, it is on the screen * /.
UL. MenuBarHorizontal ul. MenuBarSubmenuVisible ul. MenuBarSubmenuVisible
{
left: auto;
top: 0;
}/*******************************************************************************
INFORMATION DESIGN: Describes the set of colors, borders, fonts
*******************************************************************************/
/ * Submenu containers have borders on all sides * /.
UL. MenuBarHorizontal ul
{
border: 1px solid #CCC;
}
/ * Menu items are a light grey block with padding and no text decoration * /.
UL. MenuBarHorizontal a
{
display: block;
cursor: pointer;
background-color: #EEE;
Padding: 0.5em 0.75em;
Color: #333;
text-decoration: none;
}
/ Components menu that have mouse over or focus have a blue background and white text * /.
UL. MenuBarHorizontal a: hover, ul. MenuBarHorizontal a: focus
{
background-color: # 33;
color: #FFF;
}
/ * Menu items that are opened with the submenus are on MenuBarItemHover with a blue background and white text * /.
UL. MenuBarHorizontal a.MenuBarItemHover, ul. MenuBarHorizontal a.MenuBarItemSubmenuHover, ul. MenuBarHorizontal a.MenuBarSubmenuVisible
{
background-color: # 33;
color: #FFF;
}/*******************************************************************************
Submenu INDICATION: styles if there is a submenu in a given category
*******************************************************************************/
/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.
UL. MenuBarHorizontal a.MenuBarItemSubmenu
{
background-image: url (SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 50 95%;
}
/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.
UL. MenuBarHorizontal ul a.MenuBarItemSubmenu
{
background-image: url (SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 50 95%;
}
/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" positioned on the far left (95%) and centered vertically (50%) * /.
UL. MenuBarHorizontal a.MenuBarItemSubmenuHover
{
background-image: url (SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 50 95%;
}
/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" positioned on the far left (95%) and centered vertically (50%) * /.
UL. MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
background-image: url (SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 50 95%;
}/*******************************************************************************
BROWSER HACKS: hacks below should not be changed, unless you are an expert
*******************************************************************************/
/ * HACK FOR IE: to ensure that sub menus show above form controls, underpin us each submenu with an iframe * /.
UL. MenuBarHorizontal iframe
{
position: absolute;
z index: 1010;
Filter:alpha(opacity:0.1);
}
/ * HACK FOR IE: to stabilize the appearance of the menu items. the slash in the float is to keep IE 5.0 analysis * /.
@media screen, projection
{
UL. MenuBarHorizontal li. MenuBarItemIE
{
display: inline;
f\loat: left;
Background: #FFF;
}
}SpryMenuBar.js - version 0.12 - Pre - Release Spry 1.6.1
//
Copyright (c) 2006. Adobe Systems Incorporated.
All rights reserved.
//
Redistribution and use in source form and binary, with or without
modification, are permitted provided that the following conditions are met:
//
* The redistributions of source code must retain the above copyright notice
This list of conditions and the following disclaimer.
* The redistributions in binary form must reproduce the above copyright notice
This list of conditions and the following disclaimer in the documentation
and/or other documents 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 written permission.
//
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS WHAT.
AND ANY EXPRESS WARRANTY OR IMPLIED, INCLUDING, BUT WITHOUT LIMITATION, THE
GUARANTEED IMPLICIT QUALITY MARKET AND ADEQUACY HAS A PARTICULAR PURPOSE
ARE EXCLUDED. IN NO CASE WILL THE OWNER OF THE COPYRIGHT OR CONTRIBUTORS BE
RESPONSIBLE FOR DIRECT, INDIRECT, INCIDENTAL, SPECIAL DAMAGES, COPIES, OR
CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PURCHASES OF)
SUBSTITUTE PRODUCTS 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)
RESULTING FROM THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
POSSIBILITY OF SUCH DAMAGES./*******************************************************************************
SpryMenuBar.js
This file manages the JavaScript for the Spry menu bar. You should have no need
to change this file. Some highlights of the object from the menu bar, is that the timers are
used to prevent the display until the user has flown over the parent of submenus
menu item for some time, but also a timer for when they leave a submenu to keep
display this submenu until that timer starts.*******************************************************************************/
var Spry; If (!.) Spry) Spry = {}; If (!.) Spry.Widget) Spry.Widget = {};
Spry.BrowserSniff = function()
{
var b = navigator.appName.toString ();
var up = navigator.platform.toString ();
au var = 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. Platform] = true;
This.v = this.version;If (this.safari & & this.mac & & this.mozilla) {}
This.Mozilla = false;
}
};Spry.is = new Spry.BrowserSniff ();
Constructor for the Menu bar
element must be an ID of an unordered list (< ul > tag)
preloadImage1 and preloadImage2 are images for the rollover a State 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 menu (under-) current, in that we operate
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'))
{
deposit on older browsers not taken in charge
return;
}Difficulty of flickering images CSS IE6
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 the overview images now
If (OPTS)
{
for (var k opts)
{
If (typeof this [k] is "undefined")
{
rollover var = new Image;
rollover. SRC = opts [k];
}
}
Spry.Widget.MenuBar.setOptions (, opts);
}Safari does not support the 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)
.tabIndex items [i]. GetElementsByTagName ('a') [0] = '-1';(Items [i], element); This.Initialize
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 ++)
{
. style.position linkitems [i] = '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).
{
Returns false;
}
Returns 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 the Menu bar
join an event a tag without creating annoying HTML code
Spry.Widget.MenuBar.prototype.addEventListener = function (element, eventType, Manager, capture)
{
Try
{
If (element.addEventListener)
{
element.addEventListener (eventType, Manager, capture);
}
Else if (element.attachEvent)
{
element.attachEvent ("on" + eventType, handler);
}
}
catch (e) {}
};menu bar createIframeLayer
creates an IFRAME under a menu that appears above the 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 ';
};menu bar removeIframeLayer
Removes an IFRAME under a menu to reveal form and ActiveX controls
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]);
}
};menu bar clearMenus
root is the unordered list of high level (< 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);
};menu bar bubbledTextEvent
identify bubbled events text in Safari, so we can ignore
Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
{
return Spry.is.safari & & (event.target == event.relatedTarget.parentNode |) (event.eventPhase == 3 & & event.target.parentNode == event.relatedTarget)) ;
};menu bar showSubmenu
set the CSS class on this menu to show
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);
};menu bar hideSubmenu
delete the CSS class on this menu to hide
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);
}
};initialization of the Menu bar
create listeners for events for the widget bar of menus so that we can properly
show and hide sub-menus
Spry.Widget.MenuBar.prototype.initialize = function (listitem, element)
{
var opentime, closetime;
link var = listitem.getElementsByTagName ('a') [0];
submenus var = 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 which comes standard in Internet Explorer to determine
If a node is in another node
ListItem.Contains = function (testNode)
{
It's the list item
if(testNode == null)
Returns false;if(testNode == This)
Returns true;
on the other
Return this.contains (testNode.parentNode);
};
}need to set this to reach lower
var self = this;
this.addEventListener (listitem, "mouseover", Function {self.mouseOver (listitem, e)}; false);
this.addEventListener (listitem, 'mouseout/mouseouthandler()', Function {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 {self.keyFocus (listitem, e)}; false);
}
};
Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e As EventArgs)
{
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 open current item
If (! this.lastOpen)
return;If (el)
{
El = el.getElementsByTagName ('a') [0];
check children
var point = this.lastOpen;
While (article! = this.element)
{
var tmp = el;
While (tmp! = this.element)
{
If (tmp is point)
return;
try {}
tmp = tmp.parentNode;
} catch (err) {break ;}
}
Item = item.parentNode;
}
}
var point = this.lastOpen;
While (article! = this.element)
{
this.hideSubmenu (item.parentNode);
link var = 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;
ListItem var = this.lastOpen.parentNode;
var this.lastOpen = link;
submenus var = listitem.getElementsByTagName ('ul');
var menu = (submenus.length > 0? submenus [0]: null);
var hasSubMenu (menu) =? true: false;opts var = [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 (opt, 'y', 1);
break;
case this.downKeyCode:
found = this.getElementForKey (opt, 'y',-1);
break;
case this.leftKeyCode:
found = this.getElementForKey (opt, 'x', 1);
break;
case this.rightKeyCode:
found = this.getElementForKey (opt, 'x',-1);
break;
case this.escKeyCode:
case 9:
this.clearSelection ();
this.hasFocus = false;
default: return;
}
switch (found)
{
case 0: return End Function
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 is opts [found] .getElementsByTagName ('a') [0];.
If (opts [found].nodeName.toLowerCase () is "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 the new management of the events by the browser
Return Spry.Widget.MenuBar.stopPropagation (e);
};
Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e As EventArgs)
{
link var = listitem.getElementsByTagName ('a') [0];
submenus var = 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 the propagated events text
return;
}If (listitem.closetime)
clearTimeout() (listitem.closetime);if(this.currMenu == ListItem)
{
this.currMenu = null;
}move the focus too
If (this.hasFocus)
Link.Focus ();the menu highlighted
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 As EventArgs)
{
link var = listitem.getElementsByTagName ('a') [0];
submenus var = listitem.getElementsByTagName ('ul');
var menu = (submenus.length > 0? submenus [0]: null);
var hasSubMenu (menu) =? true: false;
If (this.bubbledTextEvent ())
{
ignore the propagated events text
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, siblings)
{
var = element [brother] child;
While (child & & child.nodeName.toLowerCase ()! = "li")
child = child [brother];return of child;
};
Spry.Widget.MenuBar.prototype.getElementForKey = function (SLE, prop, dir)
{
var found = 0;
var Rect = Spry.Widget.MenuBar.getPosition;
Var ref = rect (els [found]);var hideSubmenu = false;
make the visible subitem to calculate the position
If (els [1] & &! this.hasClassName (els [1], this.)) MenuBarSubmenuVisible))
{
. style.visibility Els [1] = "hidden";
this.showSubmenu(els[1]);
hideSubmenu = true;
}var isVert = this.hasClassName (this.element, this.verticalClass);
hasParent var = els [0].parentNode.parentNode.nodeName.toLowerCase () == 'li '? true: false;
for (var i = 1; i < els.length; i ++) {}
When you browse the y-axis in the menus vertical, ignore the children and parents
If (prop == 'y' & & isVert & & (i == 1 | I == 2))
{
continue;
}
When navigationg on the x axis in the horizontal menu LEVEL FIRST, ignore the 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;
}
}
}
In return hide the submenu
If (els [1] & & hideSubmenu) {}
this.hideSubmenu(els[1]);
. style.visibility Els [1] = ";
}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;
}
on the other
{
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)
{
CSS var = document.defaultView.getComputedStyle (item, 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 (item, 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) {}
Returns false;
}If (el.parentNode = null |) Spry.Widget.MenuBar.getStyleProp (el, 'display') == 'none') {}
the element must be visible to have a box
Returns false;
}var ret = {x: 0, y: 0};
var parent = null;
var box;If (el.getBoundingClientRect) {/ / IE}
box = el.getBoundingClientRect ();
scrollTop var = doc.documentElement.scrollTop | doc.body.scrollTop;
scrollLeft var = 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 & (absolute safari) represent bad 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;
on the other
parent = null;
If {(parent.nodeName)
var No. case = parent.nodeName.toUpperCase ();
While (parent & & case! = "BODY" & & case! = 'HTML') {}
No case = parent.nodeName.toUpperCase ();
RET.x = parent.scrollLeft;
RET.y = parent.scrollTop;
If (parent.parentNode)
parent = parent.parentNode;
on the other
parent = null;
}
}
return ret;
};Spry.Widget.MenuBar.stopPropagation = function (ev)
{
If (ev.stopPropagation)
ev.stopPropagation ();
on the other
ev.cancelBubble = true;
If (ev.preventDefault)
ev.preventDefault ();
on the other
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];
}
};It may be an idea to enable active scripting in your browser on
-
Menu Horizontal Spry does not display correctly
The next page "" http://www.ken-wo.com/beta " has a horizontal menu spry and when his view in Firefox, it works perfectly, seen in IE, it does not appear correctly and displays the drop-down menu at the top of the page rather than under the menu."
Look forward to help, thanks in advanceHere, it's pretty late for me to really check your site, but you have a little
Funky coding going on this page that could very well contribute to the
bewilderment of the submenus... seems you add styles directly via
the Inspector who is a no-no. You should be doing all the styling
about the spry menu via the style sheet...
you have this for example: and there are many more of them scattered throughout the code. I have also
Note that you used for centering divs that cannot be helping either.Why not return to the stylesheet that was created as soon as you
added the menu of the page and edit ONLY via the style sheet and
see how you go.--
Nadia
Adobe® Expert community: Dreamweaver
----------------------------------------
CSS templates | Tutorials | SEO articles
http://www.DreamweaverResources.com
~ Available customization service ~
http://www.csstemplates.com.au
Spry Widget examples:
http://www.DreamweaverResources.com/Spry-widgets/
----------------------------------------> Next page "" http://www.ken-wo.com/beta " has a horizontal menu spry"
> and
> when his view in Firefox it works perfect, seen in IE is not
> display correctly and the drop down menu displays at the top of the page
> more
> then in the menu.
>
> I look forward to help, thanks in advance
>-
Menu bar drop-down horizontal->; bar drop down Vertical menu
Hello
I need help to put a drop down menu bar horizontal to a drop-down menu bar vertical. I'm not experienced with CSS so don't know how to change the code correctly. I would get the submenu passes vertically next to the main menu.
http://www.villalotus.NET/test/test.htm
Thanks in advance!
Thanks Ken! Position is now correct.
But the submenu does not disappear once hovered and if you move down to the next link. It disappears if I move the mouse to the left or go under submemnu.
Post edited by: Karonaful
-
Newbie needs help!
I try to print the photo of full body, but need to fit the image horizontally, not vertically. I turn picture or turn paper into the printer?
What version of Windows are you using?
You can try to open the picture in paint and adjust the print settings and change the orientation from there.
-
How can I fix the screen because everything is horizontal and not vertical poster?
How can I fix the screen because everything is horizontal and not vertical poster?
Hello
Please tr
- Press and hold Ctrl + Al bot
- Press the enemy (left or right because I do not know what sense on your screen)
Hope this helps
-
Define the components horizontally and not vertically
Hello
Where can I set up a page layout object so that the components inside are displayed horizontally and not vertically?
Thank you
TSPSHello
Example of
EDIT:
You must include the content it contains.Kind regards
Sicard.Published by: Santosh Vaza August 8, 2011 17:31
Published by: Santosh Vaza August 8, 2011 17:32
-
Why has my Automatic rotation of the ipad stopped when I pass the vertical horizontal screen remains in the vertical position?
Not all applications are supported both orientations. If you experience of this with an app that should work, you know, you most likely locked up the switch of direction. Drag your finger from the bottom of the screen bezel to display Control Center. Tap on the lock with a circular arrow icon.
-
Well, the title is pretty self-explanatory
Info: I use a demo version of Dreamwiever CS 6 (may be because?)I am building a 'demo' of a site I need to do but Divs are not vertical as in this tutorial: http://www.carlosaleman.com/tutorial3.html
my code is:<! doctype html >
< html >
< head >
< meta charset = "utf-8" >
<!-TemplateBeginEditable name = "doctitle"-->
< title > Versilia FM 103.5 Radio < /title >
<! - TemplateEndEditable - >
<!-TemplateBeginEditable name = "head"->
<! - TemplateEndEditable - >
< link href = "Css/Radioversilia.css" rel = "stylesheet" type = "text/css" > "
< / head >
< body >
< div id = 'wrapper' >
< div id = "header" > content for id "header" goes here < / div >
< div id = 'menu' > content for id "menu" goes here < / div >
< div id = 'hand' >
< div id = "leftcol" > content ID "leftcol" goes here < / div >
< div id = "rightcol" > content ID "rightcol" goes here < / div >
< / div >
< div id = "footer" > content ID "footer" goes here < / div >
< / div >
< / body >
< / html >
And CSS
@charset "utf-8";
{#wrapper}
Width: 1024px;
margin: 0 auto;
}
{body
background-color: #000;
left margin: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
#header {}
height: 335px;
Width: 901px;
background-image: url (.. / immagini/Header.png);
background-repeat: no-repeat;
float: left;
}
{#menu}
background-image: url (.. / immagini/Bannerino.png);
background-repeat: no-repeat;
float: left;
height: 90px;
Width: 901px;
do-family: "Comic Sans MS", cursive;
padding-top: 17px;
Word-spacing: 70px;
text-align: center;
color: #FFF;
}
#main {}
height: auto;
float: left;
}
{#leftcol}
padding: 2px;
float: left;
height: auto;
Width: 301px;
}
{#rightcol}
float: right;
height: auto;
Width: 340px;
margin-right: 0px;
}
#footer {}
height: 10px;
}
what I am doing wrong?
P. S.
Sorry if I'm feeling a little rough... but my English is very badTry this:
CSS:
#footer {}
Clear: both;
min-height: 10px;
}
HTML:
Insert here the content of id "header."Content ID "leftcol" goes hereInsert here the content of id 'hand '.Content ID "rightcol" goes hereNancy O.
-
get the horizontal shift of a note inserted...
Hello world
How can I get the horizontal shift of a note inserted? When I have a loop notes I can get insertionPoints, characters made reference only inside the block of notes. But I want to place the cursor before or after the block notes.
Your help will be very appreciated. Thanks in advance
Indana
Once you have the story (via the parent), you can use the storyOffset (of the object of the note) property to find the position of the note in history.
Dave
-
Spry Horizontal submenus shift of menu in Explorer bar
I am redesigning my site and manage with spry menu horizontal bar submenus which are compensatory right in Explorer. They should be aligned vertically. They work properly in Safari, Firefox and Chrome. Also get into trouble with it on the homepage where he won't fall down on the content of my table-bearing. Any suggestions on how to fix these flaws? My beta site.
Sorry, I was hoping that the doctype is the problem.
Try to move the menu constructor before the constructor slideshow as in
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
var identityslideshow = new Spry.Widget.ImageSlideShow("#identityslideshow", {
widgetID: "identityslideshow",
injectionType: "replace",
autoPlay: true,
displayInterval: 4000,
transitionDuration: 2000,
componentOrder: ["view"],
plugIns: [ ]
});
GRAMPS
-
Satellite A200 - Touchpad drop-down vertical does not present
I just installed Windows 7 on my Toshiba A200 and downloaded the drivers for the touchpad of the Toshiba site.
However, the related vertical scroll activation option is not present in the settings.Can I do to solve this problem?
Thank you.
Hello
You must install the Synaptics and the driver of the Alps touchpad.
Then you can activate the vertical scroll of the Panel-> mouse->-> settings pointing devices.Take a look in the L500 series... you will find the two pilots of the touchpad
Welcome them
-
Spry drop-down list is not showing in IE7
I use Dreamweaver CS5, Windows 7 64-bit OS and tested in IE8 or higher and firefox everything works perfectly. (except for IE7).
the problem can be found at www.maxdailydeal.com
the sub menu drop-down do not appear on IE7, can anyone help please.
Thanks in advance!
-max-
Throughout this forum, we explain that you should stay away from the absolute and relative position elements. Yet once I would say STAY AWAY FROM ABSOLUTE AND RELATIVE ELEMENTS PACKING.
To illustrate this, remove id = "floatdiv" in the menu container and you'll see that the menu works. OK, the menu do not seek as you wish, but this can easily be corrected with appropriate CSS.
GRAMPS
-
To enlarge or shrink the display in the workspace horizontally
There are no assigned keycommands for this. This means that you assign to the keys of your choice.
Here's the manual explaining how.
Maybe you are looking for
-
HP Pavilion g7-1340dx Windows 7. The error message
My computer is HP Pavilion g7-1340dx Windows 7 is my operating system. My error is failure Terminal:-for playback. C:\HP\Data\HPLB\HPLBUS. DAT appears every time I start my computer. What can be done to fix this error?
-
error 0 x 80070002 during the installation of windows xp service pack 3
.. After 20 minutes, he stops by installing the update and displays the error message, and then uninstalls and removes all files. How can I solve this problem
-
After you have reinstalled windows xp, I lost my audio devices of the system
I plugged in a new usb mouse and hub 4way in my computor screen went blue, wgen she is back on I had no control of the mouse. I plugged the old mouse, the screen was frozen. Ishut down and rebooted but nothing works. I reinstalled windows xp butnow I
-
my screen is stretched, how do I return it to how it was
my screen is stretched, how do I return it to how it was
-
When I try to install, I get an error like this: snapshot Help, please!