Added Spry menu in CS3, site is entirely blank in IE 6 or 7, fine in FF, mac

I've about had it. Built a site, posted here with some issues
with a P7 menu adding blue bar. I deleted all the P7 code...page
was back to normal, but without a navigation bar. So, I added one
of the new Spry bars in DW, set it all up, tested it on my Mac,
works fine.
I upload all pages to server, open it in Explorer 6 and 7 on
PC, and I get one blank white page! I downloaded Firefox for PC,
and the site is fine there. It's fine everywhere else. At first, I
had just the background tile in IE. Didn't panic yet. Did some
stuff, and then even that is gone.
I can not comprehend where to begin troubleshooting this. I
did not backup the site before I started screwing with this, so I'm
in trouble here.
the url is
http://www.auroratownship.org/proto
Do you guys see a plain white page too? If you have Firefox
or another browser, can you try it there as well to see what it is
supposed to look like? I even tried deleting all the Spry menu
stuff, didn't matter.
HELP!

So far I've not spotted the problem for usre, but there is
one
validation error that you should fix, just in case.
<noscript>
<map>
Menu provided by f-source.com, All Rights Reserved. <a
href="
http://f-source.com">Web
menu</a>
</map>
</noscript>
remove that errant <map></map> tag and see what
happens.
E. Michael Brandt
www.divaHTML.com
divaGPS | divaFAQ
www.valleywebdesigns.com
JustSo PictureWindow
synterx wrote:
> I've about had it. Built a site, posted here with some
issues with a P7 menu
> adding blue bar. I deleted all the P7 code...page was
back to normal, but
> without a navigation bar. So, I added one of the new
Spry bars in DW, set it
> all up, tested it on my Mac, works fine.
>
> I upload all pages to server, open it in Explorer 6 and
7 on PC, and I get one
> blank white page! I downloaded Firefox for PC, and the
site is fine there. It's
> fine everywhere else. At first, I had just the
background tile in IE. Didn't
> panic yet. Did some stuff, and then even that is gone.
>
> I can not comprehend where to begin troubleshooting
this. I did not backup the
> site before I started screwing with this, so I'm in
trouble here.
>
> the url is
http://www.auroratownship.org/proto
>
> Do you guys see a plain white page too? If you have
Firefox or another
> browser, can you try it there as well to see what it is
supposed to look like?
> I even tried deleting all the Spry menu stuff, didn't
matter.
>
> HELP!
>

Similar Messages

Added a spry menu bar and site works in firefox but not in chrome or IE. Please help

Hello,
I'm a photographer by trade and have only picked up enough web design knowledge in order to build a website that isn't distracting to my photographs and is simple to update and mantain. Please breakdown any answers to my questions in very simple terms.
To start off here is a link to my site for reference. www.cechternach.com
1. My Biggest problem right now is that my site works in firefox but appears as a blank white page in chrome and in IE it only shows my background color.
I'm assuming that this has something to do with the spry menu bar I added. The galleries, banner, and footer were all part of a previous version of this website that didn't use the menu bar. I actually used png's exported from an illustrator as buttons. I've been wrestling with this menu bar for a few days now. I had an issue with the menubar forcing down the gallery below it. that was fixed by changing a position value from relative to absolute in the menubar css. Then I couldn't see the submenu over the galleries. I think I fixed that with a wmode change but I"m not sure if I did that right. I believe i needed to change that in the object and embed part of the code. One spot for certain browsers and the other spot for other browsers. I was a little confused on this because i also read that i needed to change the wmode in the javascript file in dreamweaver cs4 which is what i'm using. Whatever wmode I changed it seemed to work in firefox. The submenu background was showing up transparent but i fixed that in the menubar css.
2. I would like the submenu's to have a semi transparent blurred background effect. Is this possible with a spry menu bar?
3. How do I center my text in the submenu?
4. My menu bar buttons should be the same font as my name in my banner. It looks fine on my computer that has that font loaded but on other computers I was testing the site on the menubar buttons show up as a default font. How can i fix this?
5. Is there any way to get rid of the grey lines that show up around my slideshow pro galleries and menu bar buttons when they are clicked?
The last four questions aren't as important as the first one. I may be upsetting the flow of the forum as well. Please let me know if I'm not following procedure with any of my questions. Feel free to point out any other problems you see with my page. I'm trying to learn this as I go. Thanks in advance.

Spry widgets, which includes the SpryMenuBar, in their original state do not pose any problem in any browser!
Widgets contain two parts
JavaScript which drives the widget
CSS which styles the widget to individual tastes
The most common reason for a widget to misbehave especially in IE is because the inexperienced web developer has upset the delicate balance of the CSS. I say delicate, because in the original, great care has been taken by the Spry team to ensure cross browser compatibility.
There are other reasons why a whole page can misbehave. In these cases, the culprit should be sought outside of the Spry framework.
When trouble shooting, I would first of all comment out all of the Spry Spry parts and test the page in IE. If it does work after that, then yes come back here and we will have a look at the SpryMenuBarHorizontal.css for you.
If it doesn't work after disabling Spry, then have a look at the coding and the CSS for your page and fix that.
I hope this helps.
Ben

Wrong Font in Spry Menu DW CS3

Hi, I just got CS3 Design Premium and am playing with the
Spry Menu widget in DW. So far it's been pretty cool and fairly
easy to customize. But I'm having an issue. In DW, my menu fonts
display as a Verdana sans-serif but when uploaded to the server,
it's showing as a Times New Roman type serif font. Any clues? The
test site is here:
http://trekkin.com/test
Here is the SpryMenuBarHorizontal.css CSS file for your
viewing pleasure.

jhurlbut wrote:
> Hi, I just got CS3 Design Premium and am playing with
the Spry Menu widget in
> DW. So far it's been pretty cool and fairly easy to
customize. But I'm having
> an issue. In DW, my menu fonts display as a Verdana
sans-serif but when
> uploaded to the server, it's showing as a Times New
Roman type serif font. Any
> clues? The test site is here:
http://trekkin.com/test
>
> Here is the SpryMenuBarHorizontal.css CSS file for your
viewing pleasure.
>
> /* Menu items are a light gray block with padding and no
text decoration */
> ul.MenuBarHorizontal a
> {
> display: block;
> cursor: pointer;
> background-color: #a05030;
> padding: 0.5em 0.75em;
> color: #FFFFFF;
> font: Verdana, Arial, Helvetica, sans-serif;
> text-decoration: none;
> text-align: left;
> }
>
Change the one above for this......
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #a05030;
padding: 0.5em 0.75em;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
text-align: left;
HTH
chin chin
Sinclair

Spry Tooltip is missing on Spry menu in CS3?

I cannot find the Spry Tooltip on my Spry Menu in DW CS3? I have run the Site/Spry Updater but Tooltip is not listed?
How do I add/update my DW Spry menu to include all available Spry Widgets, tools, etc?
Thanks,
jlig

Arnout, Thanks for the reply..
However, I have read thru that document and still not sure how to:
- Apply the Spry Tooltip widget to a small Image on my page
I have already copied the two SpryTooltip.css & SpryTooltip.js files into my Spry folder & uploaded to the site
Just not sure how to apply them to the Image?

DW9 quits when adding Spry Menu elements

Using version 9.0 build 3481 on a Mac G5 tower (2@ 2GHz). I
inserted a Spry Menu Bar (vertical). Adding the first few items
went smoothly, but now when I add any items, DW "unexpectantly
quits." I've posted the work so far
HERE.
Tried repairing permissions and clearing out machine caches,
but still crashes.
Any suggestions??
Thanks,
rob

Found my answer the next morning...
In the properties panel, click the button marked "Turn Styles
Off".

Question about Spry menu for CS3

When I created a menu using Spry it inserted this code in my
template
<script type="text/javascript">

</script>
does the path ../SpryAssets/SpryMenuBarRightHover.gif
reference where the gif file is located in relationship to the
SpryMenuBar.js or is it suppose to be in relationship to the web
page?
I assume this is a value passed into the constructor of the
Javascript file.

This is a little ambitious, but it is doable with CSS floats. You'll need 2 menus. One floated left, one floated right and your logo image in the middle.
Floats & Margins tutorial:
http://alt-web.com/DEMOS/3-CSS-boxes.shtml
More on floats:
http://css.maxdesign.com.au/floatutorial/
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com

How to create multiple spry menu in one site?

Hello,
I know it's been answered before but I couldn't get a step by step answer. I have a template already live. It has a menu with 5 items. I need to add another menu with 7 items in one of the pages in the same site. How could I do this?
Zandy Leonard
[Personal contact info removed by moderator]

Wouldn't it be simpler to add seven items to the menu you have now?
If that can't fly, please read about Optional Regions.
http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7acca.h tml#WScbb6b82af5544594822510a94ae8d65-7acaa
Nancy O.

Spry Menu Hover behavior

First let me apologize and say I'm a total CSS noob and I
know this is probably a simple issue for you CSS masters out there
- but I'm at a loss :(
My client wants a horizontal spry menu for her site. Instead
of colors, she would like to use images for the buttons. Simple
enough no? I've figured out how to segragate the behaviors for the
button display. But, I can't figure out how to have different hover
behaviors for the main menu buttons and the sub-menu buttons.
For my test page I created a multitude of colored buttons so
I could see the affect of each change I make. I know the
ul.MenuBarHorizontal a.MenuBarItemHover is controlling the hover
behavior for the MenuBarHorizontalSub and the MenuBarItemNoSubmenu
classes (I have the background image for this style set to
PinkButton.gif) - what I want is to have the hover behavior for the
MenuBarHorizontalSub class to have a different image.
I've added MenuBarHorizontalSub a:hover to my CSS and changed
the image to RedButton.gif but it has no affect on the hover
behavior because I'm still seeing the PinkButton.gif.
Here is my test page:
http://www.altrusadistrict1.org/index3.html
Here is a link to the CSS:
http://www.altrusadistrict1.org/SpryAssets/SpryMenuBarHorizontal.css
Any help is GREATLY appreciated!
Thanks,
Sue in NH

First let me apologize and say I'm a total CSS noob and I
know this is probably a simple issue for you CSS masters out there
- but I'm at a loss :(
My client wants a horizontal spry menu for her site. Instead
of colors, she would like to use images for the buttons. Simple
enough no? I've figured out how to segragate the behaviors for the
button display. But, I can't figure out how to have different hover
behaviors for the main menu buttons and the sub-menu buttons.
For my test page I created a multitude of colored buttons so
I could see the affect of each change I make. I know the
ul.MenuBarHorizontal a.MenuBarItemHover is controlling the hover
behavior for the MenuBarHorizontalSub and the MenuBarItemNoSubmenu
classes (I have the background image for this style set to
PinkButton.gif) - what I want is to have the hover behavior for the
MenuBarHorizontalSub class to have a different image.
I've added MenuBarHorizontalSub a:hover to my CSS and changed
the image to RedButton.gif but it has no affect on the hover
behavior because I'm still seeing the PinkButton.gif.
Here is my test page:
http://www.altrusadistrict1.org/index3.html
Here is a link to the CSS:
http://www.altrusadistrict1.org/SpryAssets/SpryMenuBarHorizontal.css
Any help is GREATLY appreciated!
Thanks,
Sue in NH

Spry Menu Invisible in IE

Hey there folks. For help in the past I'm grateful. My website (and that I've done for a friend) looks great.
I am trying to put a "Country List" vertical spry menu on my site (within a table). I am using DW CS5. In Firefox it appears just fine ( see www.aloe-vera.org/index.htm ) but in IE 8 (and I suppose earlier versions) it does not appear at all unless you mousover. But, anybody who mouses over would do so as a happy accident only. Without the menu appearing (it is totally invisible), there is no way to know that they can select their country.
I would like to get rid of the menu at the top of the pages (it just doesn't look good) and leave the 'header' section as only a title for the page.
But, before I can get ride of that, I really need the country menu to the left (of the "Facebook 'Recommend') to appear in all browsers as soon as the page loads, not only when somebody happens to mouse over it.
For assistance, I'd be grateful. And, today is my 54th birthday - so you could consider your help an added birthday gift!
Thanks alot everybody,
David Honaker (Phoenix, Arizona, USA)

Just a few little adjustments to be made
1. Remove the excess rules in the following
ul.MenuBarVertical
    border: 0px none #FFF;
/*    white-space: nowrap;
    width: auto;
    font-family: Arial, Helvetica, sans-serif, Verdana;
    color: #D6D6D6;
    background-color: #060;
    cursor: auto;
    font-size: 16px;
    font-style: normal;
    font-variant: normal;*/
2. Change the colour here
ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    background-color: #FFF;
    padding: 0.5em 0.75em;
   color: #FFF;
    text-decoration: none;
3. Remove the colour here
ul.MenuBarVertical a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /*color: #FFF;*/
There may be a few other nigly little things. Just comare your modified CSS with the original.
Gramps

Another spry menu problem with ie

I dont know, but i have tried everything to getie to render the spry menu for my site : http://www.jtltours.com/proofing/, but no luch to date. As you may have seen , it works perfectly with firefox and chrome, but no luch for ie. It does'nt even seem to be rendering any css for the menu. Any help in the right direction is appreciated.

Are you sure the issue is created by Spry? I have check out the source and there seems to be allooot of JavaScript includes. Which could potentially generate IE errors them selfs and make Spry MenuBars stop working.
I haven't got IE on my machine so I can't verify it. But it might be worth looking at.

Spry Menu Bar css not compatible with IE7? or compatibility View on IE8?

Well i've made my website
. Swimmerbuddy.com
Problem:I used the spry menu bar on a div tag. I've got it working fine on several browser and so on.. but hmm. i noticed that IE7 and only on compatibility view of IE8 it does not work...
It seems like the drop down menus get cover by the main content underneath it..
I started of with dwt i made my self.This is the DWT and the css that controll the dwt and the spry menu bar.
PLZ HELP ME.. THANKS
THIS IS THE DWT THAT THE PAGE RUNS ON
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "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>

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


<style type="text/css">
a:link {
color: #000;
text-decoration: none;
</style>
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
a:visited {
color: #000;
text-decoration: none;
a:hover {
text-decoration: none;
color: #000;
a:active {
text-decoration: none;
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
    <div id="networkicons"><a href="http://www.facebook.com/?ref=logo#!/profile.php?id=100001554936595" target="_blank"><img src="../_images/facebook.png" alt="facebook.com" width="45" height="45" border="0" title="facebook.com"/></a><a href="http://www.myspace.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/myspace.png" alt="myspace.com" width="44" height="45" border="0" title="myspace.com"/></a><a href="http://twitter.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/twitter.png" alt="twitter.com" width="43" height="45" border="0" title="twitter.com"/></a><a href="http://www.youtube.com/swimmerbuddy1" TARGET="_blank"> <img src="../_images/youtube.png" alt="youtube.com" width="44" height="45" border="0" title="youtube.com"/></a></div>
    <div id="buyNow1">
      <p><a href="../order_now.html"><img src="../buynowbutton.png" alt="bt1" width="130" height="25" border="0" longdesc="Order Your Swimmer Buddy Today!!" /></a></p>
    </div>
</div>
<div id="mainNav">
    <ul id="mainNavcontent" class="MenuBarHorizontal">
      <li><a href="../index.htm">Home</a>        </li>
      <li><a href="../swimmer.html">Swimmer Buddy</a></li>
      <li><a href="../order_now.html">Order Now</a>        </li>
      <li><a href="#" class="MenuBarItemSubmenu">Gallery</a>
        <ul>
          <li><a href="../photo_gallery.html">Photos</a></li>
          <li><a href="../video_gallery.html">Videos</a></li>
        </ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">Zinger Products</a>
        <ul>
          <li><a href="http://www.winkyscoop.com/">Winky Scoop</a></li>
          <li><a href="http://www.1800succeed.com/">Hypmovation</a></li>
          <li><a href="http://www.1800succeed.org/">1800SUCCEED</a></li>
          <li><a href="http://www.zingerproducts.com">Zinger Store</a></li>
        </ul>
      </li>
      <li><a href="../about.html">About Us</a></li>
      <li><a href="../contact.html">Contact Us</a></li>
    </ul>
</div>

<div id="pageInfo">
    <div id="info_page">
      <p class="regionID">Region ID</p>
      <hr class="breaklinePageInfo" />
      <p class="breadcrum">> <a href="../index.htm">Breadcrum </a></p>
    </div>
    <div id="mainContent">
      <div id="content">
        <p>Main Content Goes her</p>
      </div>
    </div>
</div>


   <div id="buyNow2"><a href="../order_now.html"><img src="../buynowbutton.png" width="130" height="25" /></a></div>
   
<div id="footer">
<div id="footertext">
        <p class="footertextclass">Copyright © 2010 SwimmerBuddy.com. All rights reserved. SwimmerBuddy.com is part of <a href="http://www.zingerproducts.com" class="footertextclass">Zinger Products</a>. Designated Trademarks and brands are the property of their respective owners. This page was last modified Setember 28,2010. Swimmer Buddy - Pattent Pending 2010</p>
      </div>
    <div id="footerlinks">
        <p classs="footerlinkspacing"> <span class="footerlinkspacing"><a href="../Disclaimer.html">Disclaimer</a><a href="../terms.html"> Term of Service </a><a href="../contact.html">Contact Us</a></span>
</div>
      </div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("mainNavcontent", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
THIS IS THE MAIN.CSS
@charset "utf-8";
#networkicons {
height: 50px;
width: 200px;
margin-top: 160px;
margin-left: 15px;
position: absolute;
#wrapper {
width: 933px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
text-align: left;
position: relative;
#mainNav {
text-align: center;
position: relative;
margin-right: auto;
margin-left: auto;
width: 934px;
padding-bottom: 15px;
clear: both;
overflow: visible;
#navwrapper {
width: 935px;
margin-right: auto;
margin-left: auto;
#mainContent {
width: 910px;
padding-left: 10px;
padding-right: 10px;
position: relative;
padding-bottom: 20px;
padding-top: 20px;
#content {
width: 910px;
position: relative;
#wrapper #footer #footerlinks p .footerlinkspacing a {
margin-right: 20px;
#footer {
width: 930px;
background-color: #fff;
position: relative;
margin-top: 5px;
text-align: center;
color: #000;
padding-bottom: 10px;
margin-bottom: 15px;
#header {
width: 930px;
height: 209px;
background-image: url(../_images/header.jpg);
background-repeat: no-repeat;
#buyNow1 {
height: 25px;
width: 140px;
float: right;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-align: center;
background-repeat: no-repeat;
color: #666;
padding: 5px;
position: absolute;
top: 160px;
right: 150px;
.buyNow1 {
color: #666;
#wrapper #pageInfo #info_page .breadcrum {
color: #003;
#wrapper #pageInfo #info_page .breadcrum a {
color: #003;
html, body {
margin: 0px;
padding: 0px;
#buyNow2 {
height: 25px;
width: 130px;
float: right;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-align: center;
padding: 5px;
position: relative;
#wrapper #buyNow2 a img {
position: absolute;
top: -30px;
right: 50px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
#pageInfo {
width: 930px;
background-image: url(../_images/pageinfobackground.jpg);
background-repeat: repeat-x;
background-color:#FFF;
text-align: left;
padding-bottom: 15px;
margin-top: 18px;
position: relative;
overflow: visible;
visibility: visible;
#wrapper #mainNav #mainNavcontent {
position: absolute;
left: 0px;
width: 930px;
.regionID {
font-size: 2em;
font-weight: bold;
color: #FFC;
margin-top: 1em;
margin-bottom: 0em;
text-align: left;
margin-left: 5px;
.breaklinePageInfo {
margin-top: 0.5em;
color: #FAFEAB;
.breadcrum {
color: #003;
font-size: 1.1em;
font-weight: bold;
text-decoration: underline;
margin-top: -0.2em;
margin-left: 15px;
#breadcrum {
font-weight: bold;
color: #003;
#footertext {
width: 910px;
font-size: 0.6em;
padding-left: 10px;
padding-right: 10px;
margin-top: 10px;
#footerlinks {
width: 930px;
font-size: 0.7em;
font-weight: bold;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: #000;
position: relative;
margin-top: 10px;
margin-bottom: 5px;
.footertextclass {
color: #000;
.footerlinkspacing {
margin-top: -0.5em;
color: black;
height: 10px;
font-style: normal;
line-height: normal;
font-variant: normal;
letter-spacing: normal;
p {
margin: 0px;
padding: 0px;
body {
text-align: center;
margin-top: 5px;
background-color: #073e78;
background-image: url(../_images/background.jpg);
background-repeat: repeat-x;
background-attachment: scroll;
font-size: 100%;
THIS IS THE dropdown menu.css
@charset "UTF-8";
/* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
ul.MenuBarHorizontal
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
/* 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 a fixed width */
ul.MenuBarHorizontal li
margin: 0px;
padding: 0;
list-style-type: none;
font-size: 100%;
position: static;
text-align: center;
cursor: pointer;
width: 132.8px;
float: left;
overflow: visible;
visibility: visible;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 132.8px;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 8.2em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: #333;
color: #FFF;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #FFF;
padding: 0.5em 0.75em;
color: #333;
text-decoration: none;
background-image: url(../_images/bar-top.png);
background-repeat: no-repeat;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #003;
background-image: url(../_images/bar-Bottom.png);
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
color: #003;
background-image: url(../_images/bar-Bottom.png);
background-position: bottom;
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.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(../_images/bar-topsub.png);
background-repeat: no-repeat;
background-position: right top;
/* 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.MenuBarHorizontal ul 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.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(../_images/bar-topsubhover.png);
background-repeat: no-repeat;
background-position: right bottom;
/* 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.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

Thanks a lot for that tip. It does improve it by a whole lot.. i c what my mistake was.. however, something is still off
.. The Drop down menu is not behaving well...
As you may c by the picture, the drop down menu now moves to the right. and is not because of the object to its left, i've modified that. Zinger Products Drop Down Menu also does the same.

Spry Menu Bar Mac Issue

Hello,
Link:
http://www.therockchurch.tv/about_trc.html#welcome
Issue: Mac Safari doesn't like the spry menu bar. The sub
menus disappear and flicker. Everything works fine on all browsers
using widows including safari for windows. The menu just doesn't
like mac. Any help?
-R

"kinblas" <[email protected]> wrote in
message
news:f7rdd2$7ri$[email protected]..
> Hmm, I'm not seing any flashing on that page on my Mac
with Safari. It
> looks
> pretty good.
>
> I am seeing it on your homepage:
>
>
http://www.throckchurch.tv
>
> but it looks like it is due to the fact that Safari is
struggling to keep
> up
> with rendering all that Flash animation on your page.
>
> On windows with FireFox, the homepage is starving the
browser and pegging
> my
> CPU at 100%.
In IE7 Vista, my CPU is pegged at 22%. I do not run flash in
Firefox because
of its rendering engine issues, so that might be an issue
there. Safari has
known issues rendering CSS hovers on top of flash. The
workaround is to
remove hovers or live with it.
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"

Message: "Administration rights are required to complete Adobe Add-ons installation or removal" - this pops up every few seconds after installing CC 2014. When I double-click on it the CC console opens but is entirely blank. What can I do?

Message: "Administration rights are required to complete Adobe Add-ons installation or removal" - this pops up every few seconds after installing CC 2014. When I double-click on it the CC console opens but is entirely blank. What can I do?

Some saved Mac links that may help
-Mac 10.9.3 workaround https://forums.adobe.com/thread/1489922
-more Mac 10.9.3 https://forums.adobe.com/thread/1491469
Enable Mac Root User https://forums.adobe.com/thread/1156604
-more Root User http://forums.adobe.com/thread/879931
-and more root user http://forums.adobe.com/thread/940869?tstart=0

How to make 1 spry menu for the entire site? but not on each page

i have a website that i wish to have multiple pages available all form the same menu and late and probably at regular intervals add more tabs to the menu
is there a way to create a spry menu speratley that the page some how references, something like a frameset but without using framesets?
im sort of new to webdesigning and unsure of the correct terminology, so i am finding it difficult to look up stuff that i don't know the name for, but will gladly go read someting if you point me in the right direction.
regards
for now
wayne

You can do this with PHP or ColdFusion
These are "server side" scripting languages so you will have to test your website after you upload to you web hosting account.
Or if you set up a local server. Without the local server you will get errors when you open them in firefox.
To use the following what you do is "Cut" the part you want to be on all pages out, "Paste" it into a seperate document and in its place on your page you put one of the following suitable tags.
You will also have to rename your main file to .php or .cfm as opposed to .html
Again, whatever page you put one of these tags on, their extention must change match the type of tag used.
First Method (PHP):
PHP is the more common method -
<?php @ require_once ("yourMenu.html"); ?>
Require_once is basically a safeguard so that you don't add the menu twice onto a page.
This will only work for PHP 4+
This method would work for older versions of php too -
<?php @ include("yourMenu.html"); ?>
Second Method (ColdFusion):
This will only work if your host has ColdFusion installled -
<cfinclude template="bla.html">
eg index.html
<html>
<head>
<title>Stuff</title>
<head>
<body>
<?php @ require_once("SpryMenu.html"); ?>
</body>
</html>
SpryMenu.html
<ul id="menubar1" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
        <ul>
            <li><a href="#">Item 1.1</a></li>
</ul>

Creating multiple Spry menu bars in one site

I've been creating a website and I am required to use multiple templates to manage all the different sections of the site. To make it much less of a hassle, once I created one template, I simply saved that template as another template so I would not have to start all over again. On the first template I created a spry menu bar with a certain amount of buttons. And because I created the other templates with that template, those templates had the same menu bar containing the same settings. The problem is, because of the specified settings of the spry menu bar, if I change the amount of buttons from the original to one less, the whole bar on that template will get off center and messed up because the settings for the menu bar are not set to that certain amount of buttons, but if I change the settings to suite that amount of buttons, then the settings for all the templates change and that messes up the other menu bars on those templates because they have a different amount of buttons. Currently my templates all contain 10 buttons and I am wanting to create a new menu bar with only about 4 - 6 buttons. I thought going up to insert and inserting a brand new menu bar would do the trick but when I did that it inserted a menu bar that had all the settings of the already-created menu bar, (ie same background images, and hovers, etc.) as well as the width which, because the width is suited for 10 buttons, it does not properly make the default 4 button menu bar center correctly. And if I try to change the settings on this menu bar then the same thing happens with everything changing and getting messed up.
So after this long explanation, my question is, how can I insert multiple spry menu bars into one site that are not correlated with each other in terms of all the settings so that when changed, will not affect each other? I am guessing I am having this problem because I created all the templates from one template so they are all interlocked, but the page that I tried to insert the brand new menu bar on was not created from any of the templates and was the first page I made at the very start.
http://phonytrojanmusic.zxq.net/ Here is the link to the site. The first page that opens up is the page that I tried to insert the brand new menu bar on. If you click on band choir or elementary you will see the menu bars with 10 buttons that are all interlocked in terms of settings. Also, I'd like to note that if I delete a button in one template, it does not delete that same button in the other templates, nor does it add a button to the other templates if I add one. Only the physical appearance changes because the settings are meant for only one amount of buttons. Sorry for the novel!

Alright well I just tried to use 2 complete different templates. I created one brand new template from scratch, added the menu bar, gave it an ID of "band", and configured it to suite 10 buttons accordingly. Then I started off from scratch again with a starting html page with a different css style sheet and added the menu bar and gave it a different ID of "choir" but the settings of the two different bars still act as one set of settings! I dont know how to fix this problem. Please tell me what to post if anything will help you. Im guessing the solution is very simple but I have tried everything.
here is the code for the two different menu bars (one in each template)
choir
<ul id="Choir" class="MenuBarHorizontal">
      <li><a href="#">Programs</a>      </li>
      <li><a href="#">Home</a></li>
      <li><a href="#">Blog</a>      </li>
      <li><a href="#">Directors</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Forms</a></li>
      <li><a href="#">Calendar</a></li>
      <li><a href="#">Links</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
band
<ul id="Band" class="MenuBarHorizontal">
      <li><a href="http://phonytrojanmusic.zxq.net/index.html">Programs</a>      </li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/bandmain.html">Home</a></li>
      <li><a href="http://centerburgtrojanmusic.blogspot.com/">Blog</a></li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/directors.html" class="MenuBarItemSubmenu">Directors</a>
        <ul>
          <li><a href="http://phonytrojanmusic.zxq.net/band/directors/cooper.html">Cooper</a></li>
          <li><a href="http://phonytrojanmusic.zxq.net/band/directors/teschler.html">Teschler</a></li>
          <li><a href="http://phonytrojanmusic.zxq.net/band/directors/lee.html">Lee</a></li>
        </ul>
      </li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/shows.html" class="MenuBarItemSubmenu">Shows</a>
        <ul>
          <li class="MenuBarHorizontal"><a href="http://phonytrojanmusic.zxq.net/band/shows/field.html">Field</a></li>
          <li><a href="http://phonytrojanmusic.zxq.net/band/shows/concert.html">Concert</a></li>
        </ul>
      </li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/gallery.html">Gallery</a></li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/forms.html">Forms</a></li>
      <li><a href="http://trojanmusic.org/cal.html">Calendar</a></li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/links.html">Links</a>      </li>
      <li><a href="http://phonytrojanmusic.zxq.net/band/contact.html">Contact</a></li>
    </ul>
I currently do not have any links attached to any of the buttons in the choir bar. Something went wrong and now I have to make the whole site over again so it is not very accessible. Please post back asap!

Added Spry menu in CS3, site is entirely blank in IE 6 or 7, fine in FF, mac

Similar Messages

Maybe you are looking for