Vertical Spry Menu going nuts in IE6
Sorry for boring you with another IE tweaking issue (damn
MS).
I'm not sure if I tweaked this menu into taking on it's own
crazy behavior in IE 6 (works fine in other browsers).
It's suppose to sit nicely and quietly on the upper right
side, but in IE 6 it jumps out to the middle, leaves the background
behind and behaves very badly. When I hover my mouse over it, the
menu bars vanishes for a moment too. For a better understanding of
these unacceptable behaviors please go to: (see link below)
(the page is still under construction).
Any help will be appreciated greatly!
Tom
website
Hello Tom,
The Accordion, because of the animation and other reasons was
designed to start running after the page load finished. Therefore
we attach a listener to the body onload event and when the page
finished to load and the CSS's to apply we start enhance the
element in page.
In this situation the accordion doesn't work because the page
never notify us to finish loading. The element remains open and the
Accordion disabled.
I studied a little bit your page to determine the reasons
that doesn't permit the IE 6 to throw the correct events. Apart the
fact your page resources are huge and will take a long time to load
(5Mb) seems that you used in your design lots of PNG files. From my
experience this is not a good practice because the IE doesn't have
in any version a good support for this type of files, specially on
IE 6.
I see that you use a 'hack' to load the PNG's on IE 6 even if
they are not supported that apply some native Windows filters. This
step seems to be the origin of your problem but you'll have to
study further and determine if the CSS filters you apply or reading
the PNG's properties to generate the CSS are blocking the page to
finish loading.
Cristian
Similar Messages
-
The display of Spry submenus within the Menu Bar is very slow
with a large menuing system. Additionally, submenus are slow to
close when the mouse moves away to another 'button', resulting in
another delay in the display of the second submenu set. The lag
time issue is occurring in IE6, but not in Firefox 2, Opera 9, or
Safari 3 beta (Windows).
I suspect the cause is that IE is not applying the scripted
classes as fast the other browsers, especially as the lag is even
more visible in the display of the rollover arrow (down and/or
right). I have attempted to adjust the timeout settings (opentime
and closetime) to no effect.
The pages in which the menuing system appears are
complicated, and heavy, which may also play into the problem, but I
suspect that without a fix for the timing issue the menuing system
will proved frustrating for users.
Any suggestions on how to fix this issue anyone?
Thanks.
Skip KeatsHi, I'm a Dreamweaver CS4 / Spry newbie who had exactly the same problem with a vertical Spry menu disappearing in IE6.
After some trial and error, I found that reducing the Width in the Box category of ul.MenuBarVertical to 175 px, 5 px less than the 180 px width of my left sidebar Div <div #sidebar1> made the menus appear normally in IE6.
As you can imagine, this was a huge pain to troubleshoot - had to downgrade an old laptop to XP with IE6 to troubleshoot as I tried different fixes.
Hope this helps.
- Paul -
Help with vertical spry menu bar submenu displaying incorrectly!
I’m new to Dreamweaver and am learning as I go. I am having a problem with the vertical spry menu bar submenu in the Live View. When I scroll over the spry menu bar option that has a submenu, the submenu appears in the upper right hand corner of my screen. (My menu bar is going down the left hand side.) However, when I preview it in Internet Explorer it looks fine after I allow the Java Script to run or the Active X controls, which my browser usually automatically blocks. (The browser just displays a small message along the top and I click on it to allow it.) To get it to do this much, I had to play around with the CSS for the spry menu bar a little bit.
Before, when I clicked on the Live View option, a small message ran along the top in Dreamweaver saying it couldn’t find the Flash Plugin and asked me to download the most recent FlashPlayer, which I did twice. It continued to say that and then I just closed that message that kept popping up, but I think that has something to do with the problem. I then researched that problem in the Spry Framework Help and Dreamweaver Help, but couldn’t find a solution that worked. (Someone had posted a link for downloading the Flash Player for Netscape Navigator, but that didn’t seem to do anything.)
Please also note that I am using one of Dreamweaver’s pre-built layouts. I don’t know if that makes a difference with this problem.
How do I fix this problem so that it displays correctly in the LiveView? And will the message that I get on my browser about allowing blocked content appear on other people’s computer when they open my website?IE is a big problem child among browsers. Don't use it as your default browser.
For best results, build your site to display & perform well in the web standards browsers like Firefox, Chrome, Safari & Opera. If it works in one, it should work pretty much the same in all of them.
After you're satisfied with how your site looks in the good browsers, then test in IE. If needed, add hacks or conditional comments to make IE behave. There are many web sites that discuss known bugs in IE and how to work around them.
Lastly, the active X nag screens only appear locally. Once deployed on the remote server, you won't see them.
For better answers to your layout questions, we need to see your page. Can you post a URL?
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb -
For some reason, whenever I roll over my vertical spry menu bar, instead of it going to the side, the submenus open within the menu bar, blocking the other menu bar items. How do I make it go to the side?
Also, is there a way to make it so that the submenu items open within and underneath the menu item, but push the other menu items below it rather than going over it?
Thanks!The online version of SpryMenuBar.js is still 1.4
Instead of uploading the file, let's try to latch onto the JS file that Adobe has online. This means that you need to change line 9, or thereabouts, from
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
to
<script src="http://labs.adobe.com/technologies/spry/includes_minified/SpryMenuBar.js" type="text/javascript"></script>
Then go down to lines 28-30 and remove these as they have already been loaded above.
To make the menu stretch the full width add the following style rule or change the existing rul to include the following
ul.MenuBarHorizontal li {
width: 16.666667%;
After you have done that we'll go on from there
Gramps -
How to get rid of the line encasing the left hand side of a vertical spry menu?
Hi,
I have created a vertical spry menu bar. It all works but there is a line like this [ encasing the left hand side of the menu. Does anyone know how to get rid of this?
Thanks!Line 73 in your Spry css calls for a border
ul.MenuBarVertical{
border: 1px solid #ccc;
Either remove the rule or change the #ccc to #fff -
Vertical Spry Menu-IE alters positioning. How do I fix this? Works in all other browsers correctly.
I've recently uploaded a new website and am having a glitch with internet explorer with the vertical spry menu. It appears perfectly in all other browsers. I had added css rules to move up some of the longer submenus so they would all appear on the screen without needing to scroll down on the main page to view them. In internet explorer, it positions the top menu item, but the rest of the list does not follow in suit. Any ideas? This is super frustrating! Thanks!
link is here:
http://www.academypublishing.comHi,
I see now and it's really a little crazy, because the menus are there, just not where they should be.
I still need to investigate the matter thoroughly a little more closely, because I never saw it till now. Too bad that Gramps has not seen the thread, I'm convinced he will do the trick immediately! What if you would write a letter to him?By the way, did you make a try it with the original version of "SpryMenuBarVertical.css".
Hans-G. -
Vertical Spry menu works in IE7 but not Safari
My vertical SPRY menu works well in various versions of IE
but when I preview in Safari it has an odd way of creating the
sub-menu. Here is the visual:
http://www.ornh.mb.ca/index_test.html
Any suggestions? DawnFirst thing is first. Your spry code is out of date. You are
running version 1.4 and the latest is 1.6.1. Go to the page below
and run the Spry Updater package:
http://labs.adobe.com/technologies/spry/home.html -
IE problems with vertical spry menu bar
hi,
first of all: I'm aware that this problem has been discussed
before. but nothing I've found so far has really helped me.
the problem is that my vertical spry menu bar doesn't work
properly with the internet explorer. I've (clumsily) repositioned
the submenu bars, but that didn't seem to be the main problem.
I'm using dreamweaver cs3 on a mac and have checked for
safari and firefox, in which everything works fine. I'd be very
grateful if someone could have a look at
www.philipbirau.com/portfolio.htm.
unfortunatly, I have neither the skills nor the money for
'professional' webdesign, so any hint will be appreciated. if you
need more information, please let me know.
thanks!
philiphi,
first of all: I'm aware that this problem has been discussed
before. but nothing I've found so far has really helped me.
the problem is that my vertical spry menu bar doesn't work
properly with the internet explorer. I've (clumsily) repositioned
the submenu bars, but that didn't seem to be the main problem.
I'm using dreamweaver cs3 on a mac and have checked for
safari and firefox, in which everything works fine. I'd be very
grateful if someone could have a look at
www.philipbirau.com/portfolio.htm.
unfortunatly, I have neither the skills nor the money for
'professional' webdesign, so any hint will be appreciated. if you
need more information, please let me know.
thanks!
philip -
Background png doesn't show right in vertical spry menu in IE
Hi,
My vertical spry menu background gradient png is fine in Firefox, Safari, Chrome, etc. But in IE it shows white. I have it posted on a temporary site: http://bethniebuhr.com
Can you help me fix the IE?
Thanks.At the bottom the SpryMenuBarVertical.css you have
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;
Either set the value to transparent or remove the line altogether.
Gramps -
I posted this in the general forum, but thought I'd repost
here since this is more specific to Spry.
I'm having issues in IE (6 & 7...surprise, surprise) with
my vertical spry menu. It displays exactly the way I want it when I
use Opera. I think it has to do with the whitespace:nowrap on the
2nd level menu items, but I really don't know. I want the 2nd level
menu to be different width than the 3rd level, so I have both
levels set to auto width with nowrap.
This is how it looks in IE 7:
Menu
in IE
This is how it looks in Opera (correct):
Menu
in Opera
Attached is my CSS as well. Let me know if you need the HTML,
too.
Thank you for helping!
quote:
@charset "UTF-8";
/* SpryMenuBarVertical.css - Revision: Spry Preview Release
1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights
reserved. */
LAYOUT INFORMATION: describes box model, positioning,
z-order
/* The outermost container of the Menu Bar, a fixed width box
with no margin or padding */
ul.MenuBarVertical
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 8em;
/* Set the active Menu Bar with this class, currently setting
z-index to accomodate IE rendering bug:
http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this
container and are same fixed width as parent */
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 8em;
/* Submenus should appear slightly overlapping to the right
(95%) and up (-5%) with a higher z-index, but they are initially
off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
margin: -5% 0 0 95%;
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
width: auto;
left: -1000em;
top: 0;
white-space: nowrap;
/* Submenu that is showing with class designation
MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
width: auto;
white-space: nowrap;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
border: 1px solid #CCC;
/* Submenu containers have borders on all sides */
ul.MenuBarVertical ul
border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #EEE;
padding: 0.5em 0.75em;
color: #333;
text-decoration: none;
/* Menu items that have mouse over or focus have a blue
background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #33C;
color: #FFF;
/* Menu items that are open with submenus are set to
MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical
a.MenuBarItemSubmenuHover, ul.MenuBarVertical
a.MenuBarSubmenuVisible
background-color: #33C;
color: #FFF;
SUBMENU INDICATION: styles if there is a submenu under a
given menu item
/* Menu items that have a submenu have the class designation
MenuBarItemSubmenu and are set to use a background image positioned
on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class
designation MenuBarItemSubmenuHover and are set to use a "hover"
background image positioned on the far left (95%) and centered
vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless
you are an expert
/* HACK FOR IE: to make sure the sub menus show above form
controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the
slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;IE is a big problem child among browsers. Don't use it as your default browser.
For best results, build your site to display & perform well in the web standards browsers like Firefox, Chrome, Safari & Opera. If it works in one, it should work pretty much the same in all of them.
After you're satisfied with how your site looks in the good browsers, then test in IE. If needed, add hacks or conditional comments to make IE behave. There are many web sites that discuss known bugs in IE and how to work around them.
Lastly, the active X nag screens only appear locally. Once deployed on the remote server, you won't see them.
For better answers to your layout questions, we need to see your page. Can you post a URL?
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb -
Changing arrow color on vertical spry menu
How do I change the color of the arrow on the vertical spry menu indicating there are submenus for that topic?
http://www.ipdctest.com/SpryAssets/SpryMenuBarVertical.css
It's the background image in these two CSS rules
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
PS the path to your SpryAssets folder is wrong in the page code.
Page code:
<script src="../../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../../SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
Should be
<script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="/SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" /> -
Vertical Spry menu bar--adjusting bottom submenu
I'm trying to adjust the last submenu on my vertical Spry menu bar. Originally, the submenu caused the page to either expand when I moused over the submenu (in IE), or the page would load with white space below the footer in order to accomodate the submenu when I mouse over it (in Firefox). The adjustment I want is to move the submenu up so that neither of those things happen. I've made the adjustment appear exactly how I want it to in Chrome and Safari, but IE, Firefox, and Opera now have the submenu placed halfway up the page. I can post the code if it's helpful, but I do not have the site hosted anywhere at the moment. The adjustment I made is in the Spry menu's css:
ul.MenuBarVertical ul#last
margin: -205% 0 0 95%;
Any help is appreciated. Thank you!
SarahThanks for the reply. After changing the code to your suggestion, now the submenu loads approximately 80px below the last menu item in all browsers except IE. In IE, the submenu looks the way it did straight out of the box. Any other ideas to try?
Sarah -
How do I make Vertical Spry Menu appear in IE
The URL in question is:
http://www.ambppct.org/index_menu.php
I have inserted a Vertcal Spry Menu on this page. It functions perfectly in Safari, Firefox and IE 8. However it does not appear in previous versions of IE.
Below is the css file:
@charset "UTF-8";
/* SpryMenuBarVertical.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
ul.MenuBarVertical
margin: 0em;
padding: 0em;
list-style-type: none;
font-size: 12px;
cursor: default;
width: 12em;
font-family: Verdana, Geneva, sans-serif;
color: #C03;
font-style: normal;
z-index: auto;
background-color: #CC9999;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
width: 12em;
/* Menu item containers, position children relative to this container and are same fixed width as parent */
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 12em;
background-color: #CC9999;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
width: 12em;
left: -1000em;
top: 0;
margin-top: -5%;
margin-right: 0;
margin-bottom: 0;
margin-left: 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
width: 12em;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
width: 12em;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
border: 1px solid #D6D6D6;
width: 12em;
/* Submenu containers have borders on all sides */
ul.MenuBarVertical ul
border: 1px solid #D6D6D6;
width: 12em;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #CC9999;
color: #C03;
text-decoration: none;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
font-style: normal;
border: thin solid #D6D6D6;
overflow: hidden;
padding-top: 0.5em;
padding-right: 0.75em;
padding-bottom: 0.5em;
padding-left: 0.75em;
width: auto;
position: relative;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #CC6666;
color: #FFF;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
background-color: #C66;
color: #FFF;
width: auto;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
width: auto;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
width: auto;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: none;You will have to update your spry code (do not know how (possibly in editing the css), but it is causing the problem).
If you have CS3 or 4, you can use the spry updater extension from -
http://labs.adobe.com/technologies/spry/
Delete your old spry files then apply the spry updater by selecting, Site - Spry Updater - then select the options req'd.
Check your page works, modify the spry css as required, checking the site in the browsers after every change.
PZ -
Vertical Spry Menu Bar not working in all browsers
Hi, everyone!
I'm hoping you'll help me troubleshoot something. I have a spry menu bar (vertical) that's expanding properly in IE but not in Firefox or other browsers. Here is the link:
http://midlochorus.org/
Thanks in advance for any help!
KarenI'm pretty bummed not to receive any answers to this. Is there nobody who can help me?
-
Dreamweaver Vertical Spry Menu Problem in IE7
I just finished setting up a vertical, 3-level spry menu in
Dreamweaver CS3, and when I preview it in IE7, several pixels have
been added in between the buttons, which spreads the menu out and
looks terrible. The problem disappears after I clear the ActiveX
warning, and it doesn't occur in FF. Could someone please tell me
how to fix this??
Here's my SpryMenuBarVertical.css file:
@charset "UTF-8";
/* SpryMenuBarVertical.css - Revision: Spry Preview Release
1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights
reserved. */
LAYOUT INFORMATION: describes box model, positioning,
z-order
/* The outermost container of the Menu Bar, a fixed width box
with no margin or padding */
ul.MenuBarVertical
margin: 0;
padding: 0;
list-style-type: none;
font-size: 0.8em;
cursor: default;
width: 150px;
/* Set the active Menu Bar with this class, currently setting
z-index to accomodate IE rendering bug:
http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this
container and are same fixed width as parent */
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 150px;
/* Submenus should appear slightly overlapping to the right
(95%) and up (-5%) with a higher z-index, but they are initially
off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
margin: -5% 0 0 95%;
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
left: -1000em;
top: 0;
/* Submenu that is showing with class designation
MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
background-image:url(../images/topnav-up-165.gif);
background:#FFFFFF;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #FFFFFF;
background-image:url(../images/topnav-up.gif);
padding: 0.3em 0.3em;
color: #333;
text-decoration: none;
/* Menu items that have mouse over or focus have a blue
background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #FFFFFF;
color: #333;
/* Menu items that are open with submenus are set to
MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical
a.MenuBarItemSubmenuHover, ul.MenuBarVertical
a.MenuBarSubmenuVisible
background-color: #FFFFFF;
color: #333;
SUBMENU INDICATION: styles if there is a submenu under a
given menu item
/* Menu items that have a submenu have the class designation
MenuBarItemSubmenu and are set to use a background image positioned
on the far left (95%) and centered vertically (50%)*/
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(../images/topnav-up.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
background-color: #038203;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #666666;
border-top-width: 2px;
border-top-color: #FFFFFF;
border-right-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-right-style: solid;
border-left-style: solid;
border-right-color: #666666;
border-left-color: #FFFFFF;
/* Menu items that are open with submenus have the class
designation MenuBarItemSubmenuHover and are set to use a "hover"
background image positioned on the far left (95%) and centered
vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(../images/topnav-dn.gif);
background-repeat: no-repeat;
background-position: 0% 50%;
BROWSER HACKS: the hacks below should not be changed unless
you are an expert
/* HACK FOR IE: to make sure the sub menus show above form
controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the
slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;I just finished setting up a vertical, 3-level spry menu in
Dreamweaver CS3, and when I preview it in IE7, several pixels have
been added in between the buttons, which spreads the menu out and
looks terrible. The problem disappears after I clear the ActiveX
warning, and it doesn't occur in FF. Could someone please tell me
how to fix this??
Here's my SpryMenuBarVertical.css file:
@charset "UTF-8";
/* SpryMenuBarVertical.css - Revision: Spry Preview Release
1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights
reserved. */
LAYOUT INFORMATION: describes box model, positioning,
z-order
/* The outermost container of the Menu Bar, a fixed width box
with no margin or padding */
ul.MenuBarVertical
margin: 0;
padding: 0;
list-style-type: none;
font-size: 0.8em;
cursor: default;
width: 150px;
/* Set the active Menu Bar with this class, currently setting
z-index to accomodate IE rendering bug:
http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this
container and are same fixed width as parent */
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 150px;
/* Submenus should appear slightly overlapping to the right
(95%) and up (-5%) with a higher z-index, but they are initially
off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
margin: -5% 0 0 95%;
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
left: -1000em;
top: 0;
/* Submenu that is showing with class designation
MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
background-image:url(../images/topnav-up-165.gif);
background:#FFFFFF;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #FFFFFF;
background-image:url(../images/topnav-up.gif);
padding: 0.3em 0.3em;
color: #333;
text-decoration: none;
/* Menu items that have mouse over or focus have a blue
background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #FFFFFF;
color: #333;
/* Menu items that are open with submenus are set to
MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical
a.MenuBarItemSubmenuHover, ul.MenuBarVertical
a.MenuBarSubmenuVisible
background-color: #FFFFFF;
color: #333;
SUBMENU INDICATION: styles if there is a submenu under a
given menu item
/* Menu items that have a submenu have the class designation
MenuBarItemSubmenu and are set to use a background image positioned
on the far left (95%) and centered vertically (50%)*/
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(../images/topnav-up.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
background-color: #038203;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #666666;
border-top-width: 2px;
border-top-color: #FFFFFF;
border-right-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-right-style: solid;
border-left-style: solid;
border-right-color: #666666;
border-left-color: #FFFFFF;
/* Menu items that are open with submenus have the class
designation MenuBarItemSubmenuHover and are set to use a "hover"
background image positioned on the far left (95%) and centered
vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(../images/topnav-dn.gif);
background-repeat: no-repeat;
background-position: 0% 50%;
BROWSER HACKS: the hacks below should not be changed unless
you are an expert
/* HACK FOR IE: to make sure the sub menus show above form
controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the
slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;
Maybe you are looking for
-
I am using an iPAD2 with 32gbytes on iOS8.1.1. After upgrading to iOS8.0, the movies I had on my iPAD no longer would play. When I select a movie, it changes to the play screen, then immediately flips back to the selection screen. The movies are in
-
I for the first time since buying my iphone and ipods for almost three years am concedering getting rid of them as I am getting tired of this problem. I can sync anything from my computer to the iphone. I can not sync movies bought on the iphone to m
-
HT1386 I cannot my iphone to connect to itunes on my computer
I cannot get my computer to connect my iphone to itunes
-
ALV printed in batch with fixed columns
Hi, I am trying to print an ALV List report in a batch job. Fixed column widths and a filter on the layout was a requirement, so I have a layout variant as part of the initial selection screen and my batch variant. When I print online, it looks great
-
Standby db: continue manualluy alter database register logfile
Hi, in my standby db 10.2.0.4, on linux platform, some archive log are not register properly and i need to perform the register logfile manually. Which test a can i do to solve this problem? Thank you.