Spry Navigation Submenu missing
I have a spry navigation menu on my site. In IE6 everything
is fine. But when I go to IE7 when you hover over the button and
the submenu appears only 1 and a half buttons show up, when there
should be a vertical list of 6. I am using a horizontal navigation
bar and the submenu comes up below. Any ideas for me to try?
Thanks for your help. Bryan
Hello,
Get rid of height: 0px; at the bottom of this in your spry
stylesheet:
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: center;
cursor: pointer;
width: auto;
float: left;
height: 0px;
By the way, are you able to view the page in Firefox? When I
try to it
crashes FF.
Take care,
Tim
"bryanmercer" <[email protected]> wrote in
message
news:fru709$p0k$[email protected]..
>I have attached the code in my previous mesage any help
would be
>appreciated.
>
> Thanks, Bryan
Similar Messages
-
Spry Horizontal Submenu IE bug
The Spry Horizontal submenu bar does not display correctly in
Internet Explorer. Everything appears to be working correctly in
Firefox.
The Submenu on the navigation bar keep dropping down from the
top of the browser window instead from it's corresponding parent
menu bar.
I've updated my Spry files to the latest versions, from
Adobe's site. Since the submenu works correctly in Firefox, it
makes me think this is a bug correction, not something wrong with
the css.
Do you have any suggestions on how to correct this? I've seen
this question asked alot on other Dreamweaver forums.
Thank you!!!!!!!!***SOLVED***
Hi There,
Cheers for replying. I took a look and the labs one seemed to
work correctly. From here, under the CSS Styles tab I selected the
SpryMenuBarHorizontal.css group and deleted them all. I then
cleaned out my code of the references to the menu and reinsterted
the menu (I had this problem before updating to Version 1.6.1 from
1.4).
From my own error here I would suggest justice49 deletes the
menu completely (backup first) and reinserts his/her menu. from
here, each time a change is made, preview the menu to make sure the
change doesn't break the menu. this worked for me. Also check that
your spry menu is at V1.6.1. There is a forum entry about updating
if necessary:
UPDATING
SPRY
Hope this helps. -
Spry navigation bar covers flash movie beneath it but not the jpg image, why?
i have a spry navigation bar with a flash movie underneath,
and when i hover over the navbar and the submenu pops down it
covers the flash movie, but it doesn't cover the .jpg image that is
next to the flash movie. how can i fix this? thanks.thanks for the reply Murray, a responder from the flash forum
gave me the following answer and it worked perfect.>>
The <object> and/or <embed> HTML elements that
reference your Flash content accept a number of optional
parameters. For the <object> element, these parameters are
supplied via nested <param> elements. Simply add the
following new <param>:
<param name="wmode" value="opaque">
The <embed> parameters are supplied via attributes. For
the <embed> element, add the following new attribute:
wmode="opaque"
That’s it. Your Flash content is now stackable via
z-index; for example, you may wrap your
<object>/<embed> pair in a <div> and set the
<div>’s z-index as you please.
<div style="position: absolute; z-index=1;">
<object attributes >
<embed attributes />
</object>
</div>
If you’re using Dreamweaver, just press the Parameters
button in the Insert > Media > Flash dialog or in the
Property inspector when selecting existing Flash content. Type
“wmode” (without quotes) in the name/parameter column
and “opaque” (without quotes) in the value column. That
will handle the above HTML for you, even with the new JavaScript
embedding available since the 8.0.2 update. -
Spry Navigation - CSS Question
I recently added spry navigation to my website (http://www.faithbuilders.com) and tweaked the default CSS to match the website a little better. Everything works well enough, but I've got a few things left to straighten out.
First, there is a gap between the right side of the dropdown menu and the left side of the sub-category menu that pops out to the right. See image below.
Is there any specific part in the CSS that affects this gap?
Second, since the submenu pops out to the right, it is hidden when the browser size is small enough to cover it. Is there a simple way to enable it to pop out to the left OR right, depending on where there is space for it?
Your help is greatly appreciated.
~SarahI'm Giving It All wrote:
I recently added spry navigation to my website (http://www.faithbuilders.com) and tweaked the default CSS to match the website a little better. Everything works well enough, but I've got a few things left to straighten out.
First, there is a gap between the right side of the dropdown menu and the left side of the sub-category menu that pops out to the right. See image below.
Is there any specific part in the CSS that affects this gap?
Yes amend 95% to 200px in the css rule below: (as shown)
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 200px;
I'm Giving It All wrote:
Second, since the submenu pops out to the right, it is hidden when the browser size is small enough to cover it. Is there a simple way to enable it to pop out to the left OR right, depending on where there is space for it?
Your help is greatly appreciated.
~Sarah
Not that I know of. -
Spry navigation covers flash movie element, why?
i have a spry navigation bar with a flash movie underneath,
and when i hover over the navbar and the submenu pops down it
covers the flash movie, but it doesn't cover the .jpg image that is
next to the flash movie. how can i fix this? thanks.mediastream13,
> i have a spry navigation bar with a flash movie
underneath,
> and when i hover over the navbar and the submenu pops
> down it covers the flash movie, but it doesn't cover the
.jpg
> image that is next to the flash movie.
What you're seeing is the result of the default WMODE
setting for Flash
Player, which you can change. Keep in mind, Flash content
isn't something
any browser natively supports. It requires an ActiveX
component or plugin,
and as a result, is processed outside of the browser's
composition buffer.
This lifts Flash content (and other active content, like
QuickTime, Java
applets, and so on) from the context of its surroundings. To
change that,
you can configure a SWF's WMODE setting for transparent or
opaque, as
described here:
http://www.quip.net/blog/2006/flash/how-to-position-flash-beneath-other-content
Be aware that any WMODE setting other than the default has
been known to
cause usability issues as described in the articles/blog
entries further
linked from the above URL.
David Stiller
Co-author, Foundation Flash CS3 for Designers
http://tinyurl.com/2k29mj
"Luck is the residue of good design." -
Spry Vertical Submenu Bar Appears Behind iFrame
In IE and Chrome, the Spry vertical submenu bar appears properly on every page of the website, except for the one page that has iframes.
In IE, the submenus appear behind the iFrames
In Chrome, the submenus appear in front of the iFrames but with an incomplete border
In Firefox and Safari, the submenus appear as they should (in front of the iframes and with a complete border)
I've scoured this forum and tried several fixes that seemed to work for others with slightly different conditions but didn't work for mine.
I've included my SpryMenuBarVertical.css for referece; if you can offer a fix for this particular issue, I'd be forever grateful. Thank you!
—Lisa
@charset "UTF-8"; /* SpryMenuBarVertical.css - version 0.6 - Spry Pre-Release 1.6.1 */ /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */ /******************************************************************************* LAYOUT: 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-sty le-type: none; font-size: 100%; cursor: default; width: 245px; } /* 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 are same fixed width as parent; position children relative to this container */ ul.MenuBarVertical li { margin: 0; padding: 0; list-style-type: none; font-size: 100%; position: relative; text-align: left; cursor: pointer; width: 245px; } /* Submenus are initially off the left side of the screen (-1000em) and then, on hover, appear slightly overlapping to the right and up with a higher z-index */ 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: 12em; 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 { width: 12em; } /******************************************************************************* DESIGN: color scheme, borders, fonts *******************************************************************************/ /* Outermost menu containers have no borders */ ul.MenuBarVertical { border-bottom: 0px solid Gray; } /* Submenu containers have borders on all sides */ ul.MenuBarVertical ul { border: 1px solid Gray; } /* Menu items are a mustard yellow block with padding and no text decoration */ ul.MenuBarVertical a { display: block; cursor: pointer; background-color: #E6DC8F; padding: 0.5em 1em; color: #333; text-decoration: none; border-top: 0px solid Gray; } /* Menu items that have hover or focus display with a dark green background and white text */ ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus { background-color: #275936; color: #FFF; } /* Menu items that are open with submenus are set to MenuBarItemHover with a dark green background and white text */ ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible { background-color: #275936; color: #FFF; } /* Active top-level menu items display a branch */ body#home a#homeNav, body#forsale a#forsaleNav, body#clubhouse a#clubhouseNav, body#falmouth a#aboutfalmouthNav, body#faqs a#faqNav, body#directions a#directionsNav, body#calendar a#calendarNav, body#partners a#partnersNav { background-image: url(NavBranch.gif); background-repeat: no-repeat; color: #FFF; padding-left: 50px; } /* Active top-level menu items with a submenu display a branch and a white arrow */ body#aboutridgewood a#aboutridgewoodNav, body#floorplans a#floorplansNav, body#contactrealtors a#contactNav, body#videos a#videosNav { background-image: url(NavBranchArrowWhite.png); background-repeat: no-repeat; background-color: #275936; color: #FFF; padding-left: 50px; } /******************************************************************************* 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 use a green background arrow image */ ul.MenuBarVertical a.MenuBarItemSubmenu { background-image: url(NavArrowGreen.gif); background-repeat: no-repeat; } /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and use a white background arrow image */ ul.MenuBarVertical a.MenuBarItemSubmenuHover { background-image: url(NavArrowWhite.gif); background-repeat: no-repeat; } /* Current menu items that have a submenu display a branch graphic to the left and a white arrow to the right */ body#story a#aboutridgewoodNav, body#story a#storyNav, body#neighborhood a#aboutridgewoodNav, body#neighborhood a#neighborhoodNav, body#structure a#aboutridgewoodNav, body#structure a#structureNav, body#green a#aboutridgewoodNav, body#green a#greenNav, body#maplewood a#floorplansNav, body#maplewood a#maplewoodNav, body#birchwood a#floorplansNav, body#birchwood a#birchwoodNav, body#sprucewood a#floorplansNav, body#sprucewood a#sprucewoodNav, body#aspenwood a#floorplansNav, body#aspenwood a#aspenwoodNav, body#cedarwood a#floorplansNav, body#cedarwood a#cedarwoodNav, body#oakwood a#floorplansNav, body#oakwood a#oakwoodNav, body#contactrealtors a#contactNav, body#contactrealtors a#contactrealtorsNav, body#lenders a#contactNav, body#lenders a#contactlendersNav, body#owners a#contactNav, body#owners a#contactownersNav, body#videoOverview a#videosNav, body#videoOverview a#videoOverviewNav, body#videoTour a#videosNav, body#videoTour a#videoTourNav, body#videoLender a#videosNav, body#videoLender a#videoLenderNav { background-image: url(NavBranchArrowWhite.png); background-repeat: no-repeat; background-position: -1% 50%; background-color: #275936; color: #FFF; padding-left: 50px; } /******************************************************************************* 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: left; background: #FFF; } }Long answer = z-index
http://www.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/
Nancy O. -
Spry Navigation does not work in IE version 6
I have a simple spry navigation bar at the top of website that works in all the browsers I tested it in, ie IE ver 7 and 8, Mozilla Firefox (all versions), Netscape (all versions), and Safari. The only one I can't it to work in is IE version 6. Does anyone know how to fix this?
I am attaching a copy of both browsers, one that does not work and one that does.
Thanks for your help.
PatI have the same problem. Looks great in FF, Safari, Opera,
but in IE the dropdowns are dancing all over the place. Suspect
it's something in the hover classification, but can't figure out
where the problem is:
http://www.kirkaubry.com -
I'm new to dreamweaver CS5 and have created a new spry navigation bar. Is there a way to create one generic navigation bar to be used in several different pages so when I have to update the menus, I don't have to change each spry navigation bar for each page. Basically one main navigation bar to be used in several different pages w/out having to create a nav bar for each page.
See here http://foundationphp.com/tutorials/sprymenu/ssi.php
Gramps -
SPRY Horizontal Submenu Appearing in Top Left in IE
Hi -
I've read through almost every post relating to SPRY
Horizontal Submenu issues in IE - and have done a number of things
- including upgrading to 1.6. However - nothing seems to work and
I'm at wits end. Can someone please help? The page to reference is:
www.bswiftdesign.com/millennium/claimants/index.html
The drop down menu is under "Structured Settlements". I
really appreciate anyones help!Hi bswiftdesign,
It looks like you are trying to center menu items in the
menubar and submenus. Have you seen these samples?
http://labs.adobe.com/technologies/spry/samples/menubar/CenteringHorizontalMenuBarSample.h tml
http://labs.adobe.com/technologies/spry/samples/menubar/AutoWidthHorizontalMenuBarSample.h tml
--== Kin ==-- -
How do I show what menu title is active, e.g. current page, in spry navigation?
See website http://dorsay-easton-indian-law.com/index.html
I want to have Home menu title have a different color when on index.html and so on. I keep using the term "active" for that, and "hover" for mouseover. Is that correct? And what do I need to do so that my menu displays an indication of which page is the current one?The CSS pseudo-classes in order are:
a = any link
a:link = an unvisited link (normal state)
a:visited = a link after it has been visited
a:hover = on mouseover
a:active = on click
a:focus = reached with tab key
See persistent page indicator on menus:
http://alt-web.com/Articles/Persistent-Page-Indicator.shtml
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb -
Place spry navigation on top of an image?
I have an image on the side of my web page that I am
building. I want to place a spry navigation bar on top of this
image but I can't figure out how to position it correctly. Can
anyone give me a hint? I'm using CS3 on a Mac.
Thanks,
LouIs there any way we can see your website? Fishing around in the dark is not a good way to give advice.
I should also mention that the "slicing Photoshop files" method of website building is probably not the way we build websites anymore, if I understand where you are coming from.
Generally speaking, if you have an image in the background set up in your style sheet, you should be able to put things on top of that image.
So, let's say we have a div and I'm going to call it "player." We may want to have more than one player on a page, so we'll give it a class:
CSS:
.player {
background-image: url("/path/myimage.jpg");
HTML:
<div class="player">
<audio controls>
<source src="/path/myaudio.ogg" type="audio/ogg">
<source src="/path/myaudio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
Now, what I have done here is to create an HTML5 Audio player. The web page with the audio must be HTML5. And you will probably need to edit your .htaccess file to include the following:
AddType audio/ogg .oga
AddType video/ogg .ogv
AddType application/ogg .ogg
AddHandler application-ogg .ogg .ogv .oga
If you don't know how to edit an .htaccsss file, you should be able to add those MIME types in your host's Control Panel.
The way you declare an HTML5 document is to start the document with:
<!DOCTYPE HTML>
<html>
This would be before you start your <head> region.
But I must warn you, I'm offering all of this with a great deal of trepidation. I believe you're putting together a website using tables and inline code for things like backgrounds and such. Modern web design does not use tables to format web pages.
Without looking at what you're doing, there is a very big limit as to how I can advise you.
-Mark -
Spry Navigation Bars - Make them look GOOD
Have Dreamweaver CS4 PC
Using the plain gray spry navigation bars...im somewhat
new...
Question:
Is there any company that sells or Free to "Change the Look"
of the nav bars easily?
I might w ant to change colors, make rounded edges, make type
smaller, compact specing some, adjust the length.
Does someone have a plugin or extension that works
interactively??
Thanks
Ive searched with little results on customizing spryA more full-featured menu building tool, with lots of styles:
http://www.projectseven.com/products/menusystems/pmm2/carbon.htm
Another nice menu builder, with lots of styles. Because there
are no timers,
I would recommend these for single-level menus or for menus
with a single
sub-menu level:
http://www.webassist.com/professional/products/productdetails.asp?PID=146
Neither is free.
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System
"suzzie12" <[email protected]> wrote in
message
news:gmq9u2$mfl$[email protected]..
> Have Dreamweaver CS4 PC
>
> Using the plain gray spry navigation bars...im somewhat
new...
>
> Question:
>
> Is there any company that sells or Free to "Change the
Look" of the nav
> bars
> easily?
>
> I might w ant to change colors, make rounded edges, make
type smaller,
> compact
> specing some, adjust the length.
>
> Does someone have a plugin or extension that works
interactively??
>
> Thanks
>
> Ive searched with little results on customizing spry
> -
Portal detailed navigation is missing
Hi, Gurus.
Good day!
I'd like to seek help from you because one of our end users reported that whenever he chose the links (which is under the portal favorites), the detailed navigation is missing.
I checked with most of the users, and their detailed navigation is showing okay. It seems that it only affects to one user.
I tried clearing the entire navigation cache but the issue still persists.
Would you be able to advice on this matter?
Thank you,
Virgiliohi virgilio,
i see.
first check if the collapse tray state is open (title bar on the right). if not - try to clear the personalization data within the portal of those users and check again (http://scn.sap.com/docs/DOC-2753 - the chapter "Deleting the Personalization through Personalization Clean up" also applies for NW7.31)
regards,
christian -
Revision: 21066
Revision: 21066
Author: [email protected]
Date: 2011-04-13 02:42:33 -0700 (Wed, 13 Apr 2011)
Log Message:
Navigation: Added missing test runner SWC for test project.
Modified Paths:
cairngorm3/trunk/libraries/NavigationParsleyTest/.actionScriptProperties
Added Paths:
cairngorm3/trunk/libraries/NavigationParsleyTest/libs/
cairngorm3/trunk/libraries/NavigationParsleyTest/libs/flexunitUIRunner-4.1-RC2.swcHi DST
This is a great effort and gesture. thank you on behalf of all the newbies.
PJ -
Spry Horizontal Submenu behind DIV in IE
Having problems in IE with this
menu
The menu is is an AP div, and the div that is blocking the
submenu is position: relative; The Z-index is set that this
shouldn't happen. Any help from the community would be greatly
appreciated.
Site
Styles
Menu
StylesI'm having a similar issue in IE7 in that my
Spry submenus drop down behind the tabs in
the Spry tabbed panels div I created following my navigation div. Any help out there?
Thanks!
Maybe you are looking for
-
Link to download FlashPlayer is broken
Hello On the page http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash there is a link: http://fpdownload.macromedia.com/get/flashplayer/current/install_flash_player.exe for to download the FlashPlayer. However it is br
-
Hi All, i am facing a small issue regarding dynamic invocation of webservice from another webservice.... the probelm is when i tried to invoke a simple webmethod with string return type its working as expected.. and the same method is returning an ar
-
Does the iphone support the use of a wildcard certificate?
Does the iphone support the use of a wildcard certificate? Our exchange infrastructure utilises a wildcard (*.companyname certificate) from Godaddy. - Connects fine and authenticates - Can manually sync and pull emails - Can Send and Delete emails Ho
-
How to deploy forms on oracle portal
Hello everybody I developed some forms in a client/server mode,recently I installed O9iAS(minimal edition(including HTTPserver and oracle portal)).I would like to use those forms on the internet.Its not very clear to me what I am supposed to do next.
-
Connecting 2 monitors to macbook pro retina
Can I connect two separate monitors to my MacBook Pro Retina - one through HDMI and the other through Thunderbolt to HDMI or DVI