Images in IE Render over Spry SubMenus

I've developed a Spry Menu Bar, but in IE when you open the
submenu under the 'about us' link - any image thats in the content
of the page renders over the submenu. Works fine in firefox though.
See www.genicaassist.co.uk for this example.
I've searched the net and am yet to find an answer. I need to
force IE to somehow display the menu in front of the images.

The IE has numerous bugs related with the z-indexing
therefore we usually don't advise people to use this kind of
styling in their web pages unless they really have no other choice.
To fix the bug you hit you should add for the element with
the id "left_column_container" a z-index of 1010.
Regards,
Cristian

Similar Messages

Spry Submenus falling all over themselves

What property do I need to adjust to space out my spry submenus?
I have submenus that need to have more then 5 or 6 words, they are both piling up on top of each other and expanding past the bounds of the background.
Help! please
Thanks.

It's hard to say without seeing what you're trying to do.
It's always best to provide a link to your page - upload *all* the files to a server and post a link.

Spry Submenus Rolling Up in Multiple Broswers

Hi!
I'm trying to implement the spry menu on a website but it wont work for me. When you hover over the submenus they flicker and a submenu disappers. Here's a link to a page with this happening:
http://celebrationsphotography.us/contact_test.html
Thank you for your assistance!!!
hdksmith07

Please address the following first http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmyareasbest.com%2FMI%2520cities%2 FTraverse-City.html

HT1479 I would like to know how to burn a dvd in such a way that each image can be skipped over by pressing the skip button.

I would like to know how to burn a dvd in such a way that each image can be skipped over by pressing the skip button? If anyone could help it would be greatly appreciated!

Here's how top get a slideshow that will let the viewer manually control the forward and backward movement of the slides with the forward and back buttons on the DVD remote.
1 - put the images you want to use in an iPhoto album.
2 - launch iDVD, select a theme and add a slideshow using the "+" button at the bottom:
3 - click on the Media button at the lower right hand corner of the window and then click on the Photos button.
4 - locate the iPhoto album containing your photos and drag it into the left hand pane:
5 - select Side Duration to Manual.
In order to get the maximum manual control of the slides you cannot have add any music to the slideshow. If you do add music the slideshow will continue you advance unless you pause the slideshow and/or use the advance/back buttons and then pause.
Once you have the project as you want it save it as a disk image via the File ➙ Save as Disk Image menu option. This will separate the encoding process from the burn process.
To check the encoding mount the disk image and launch DVD Player and play it. If it plays OK with DVD Player the encoding was good.
Then burn to disk with Disk Utility or Toast at the slowest speed available (2x-4x) to assure the best burn quality. Always use top quality media: Verbatim, Maxell or Taiyo Yuden DVD-R are the most recommended in these forums.
OT

Spry submenus not working while Included with SSI

I have customized and created my horizontal spry menu bar with the help of some tutorials on here, and I have pasted it onto a page without any html, head, or body tags. I have linked to the CSS files and javascript files in both the page being included and the page containing the include. But the Spry submenus wont work on the page with the include on it. But they work on the page being included.
I tried only referencing the javascript file with the page containing the include, and vice versa to no avail. Again, everything else works except the expansion of the submenus.
I am new to all of this, I only know what I have learned from doing tutorials and reading forums on this fabulous website. Has anyone encountered this problem or have a remedy? Thanks in advance.

I'm confused. The submenus in the spry menu on the included page work when I don't reference the external style sheets or the javascript in the page containing the include. Based on the explanation given by David Powers on this thread about how to use SSI with Spry, I thought all pages had to include the link to the javscript and style sheets:
http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSEE4C0148-A6F4-4bf5-9DEF-CE06AB026214a .html
Problem solved? Or if anyone has an actual explanation for this, I will leave this question unanswered.
Sorry to be so quick to post...

Spry Submenus Not Visible on RHS only

My spry submenus work totally fine except for the very far
right hand side of the page where the submenus are cut off. I can
see the very beginning of the submenu but the rest of it with the
text is hidden once it goes past the edge of the page. Clicking on
the small part which is visible works, but users still need to see
the entire submenu. This is a problem only in Firefox (3.0.7) and
Safari (3.1.2). IE7 works fine where the submenus on the RHS are
clearly visible as I hover and they extend past the right hand edge
of the page. Thanks for any input.

I could see it on Safari.. it has a Beatles poster on the Home page and then others on the other pages...
Some flucky things happen with these browsers.
Peace,
Glen
iMac G3, G4, G5 Powerbook Mac OS X (10.4.4) iPods

In finder do I need to delete all images as I have over 10000

in finder do I need to delete all images as I have over 10000

Depends on the size of your hard drive.
Good practice indicates keeping at least 15% (or 5GB, whichever is larger) of the hard drive unused, to allow the OS to use it for swap files, virtual memory needs, etc. When your drive gets more full than that odd things can start happening - sluggish behavior, program crashes, etc.
If you are short of hard drive space, by all means dispose of as many files as you can which you don't need on that drive. Either archive them off and then trsh the originals; or just trash the ones you no longer need. Don't forget to empty the trash after dropping things into it - until the trash has been emptied, anything placed in it is not yet gone.
If you are not short of hard drive space, don't worry about it. Just becuase you have a lot of files means little - it is the effect of the space they occupy, not the quantity, that may be of concern.
I have over 50,000 image files on my Snow Leopard volume. They occupy about 29GB of drive space. Since that volume has about 500GB of capacity, the space those files consume is not of concern. There is no deleterious effect resulting from their presence on the drive.

Image reference vs image "value" to pass over

I have an issue (or so I believe) with image references or pointers as I prefer to call them.
Majority of the functions use the reference and it is fine for efficiency, however...
I have two fast parallel loops working on an image. The first one, once it is done with the image, it passes it to the next loop and itself gets another image etc. The problem with this situation I have is that the second loop gets the reference and in the mean time the first one is changing the value of the image since it is working with the same reference. At least I assume it is what is happening.
The only real solution to this problem would be (imho) to pass a copy of the image (a vale instead of a pointer) to the second loop. This way each one is working on its own chunk of memory. Using queues seem reasonable to me here. The problem is I do not see a quite clear way to get to the so called value of the image instead of a pointer. I was thinking about using "Flatten to Image" and passing it over to the next loop. Is there a better way to deliver a "value" copy of the image?
Also the architecture of two loops must be kept the way it is. Do I have a more brilliant way of having two loops working in parallel and then passing over image data? Thanks a lot.
Solved!
Go to Solution.

This is my version of the image ring buffer. I briefly tested it and it seems to work. If not please let me know. If you know how to improve it, please post. Thanks
Attachments:
CirImBuf.vi ‏11 KB
CirImBufCreate.vi ‏14 KB

Large image popup on mouse over

Does any one know of an extension which creates a large image
popup on mouse over and it works with images from a database too?

Does any one know of an extension which creates a large image
popup on mouse over and it works with images from a database too?

IE displays spry submenus (incorrectly) at top of screen

I apologize for asking this question, as it looks like it has been asked before, but I've spent hours trying to get my spry navigation bar to display correctly in Internet Explorer with no luck. My project for school is due tomorrow and this is the ONLY thing that is preventing me from completing my project. I'm practically in tears!
I use a horizontal spry menu and the submenus don't drop down like they are supposed to. They show up as separate navigation menus at the very top of the screen.
What additional information do I need to provide? My mentor was unable to help me because he uses a Mac and he can't test it.
http://katiemieher.tripod.com/aychihuahuarescue
Details below.
Thanks!!
Correct:
Messed up by Internet Explorer:
CSS:
@charset "UTF-8";
/* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    padding: 0;
    list-style-type: none;
    cursor: default;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-variant: small-caps;
    text-align: center;
    line-height: normal;
    white-space: normal;
    margin-top: 0;
    margin-right: 100;
    margin-bottom: 0;
    margin-left: 0;
/* 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: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 120px;
    float: left;
    white-space: nowrap;
/* 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: auto;
    position: absolute;
    left: -1000em;
    float: right;
/* 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
    float: none;
    width: auto;
/* 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: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #F0F0F0;
    text-decoration: none;
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
/* 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: #FFF;
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
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/navbar_01.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
/* 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(../images/navbar_01.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
/* 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/navbar_hover.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
/* 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(../images/navbar_hover.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
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;
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
/* 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-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;

Hi Katie,
I understand. Here is a revised style sheet. I cannot verify it because I do not have version 1.4 on my computer. Please try it, make sure you keep a copy of your own style sheet in case. After installation please give me your feedback.
@charset "UTF-8";
ul.MenuBarHorizontal
    padding: 0;
        margin: 0;
    list-style-type: none;
    cursor: default;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-variant: small-caps;
    text-align: center;
ul.MenuBarActive
    z-index: 1000;
ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 120px;
    float: left;
ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 120px;
    position: absolute;
    left: -1000em;
    float: right;
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
ul.MenuBarHorizontal ul li
    width: 120px;
ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
ul.MenuBarHorizontal ul
    border: 1px solid #CCC;
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #F0F0F0;
    text-decoration: none;
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    color: #FFF;
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-image: url(../images/navbar_hover.gif);
    background-repeat: repeat-x;
    background-position: 0% 0%;
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
        filter:alpha(opacity:0.1);
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: left;
    background-image: url(../images/navbar_01.gif);
    background-repeat: repeat-x;
Ben

Horizontal Spry submenus error in IE6

I have searched every horizontal menu post on this forum for
this answer. I have also edited every line in the CSS to see if it
was causing this problem. I don't know enough CSS to think up my
own CSS but have attempted some new things. My site is live and
getting about 300 visitors a day. About 60% of them are still using
IE6 so they are seeing my embarrassing disaster. I desperately need
help.
I designed and debugged my spry menu for Firefox and IE7.
But they are not working on IE6. My horizontal menu at
www.pocatellocvb.com pushes
the page content down. I need to fix it ASAP.
Here is my CSS:
/* 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: 14px;
cursor: default;
width: 760px;
white-space: nowrap;
/* 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: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
float: left;
width: auto;
white-space: nowrap;
padding-top: 0;
padding-right: 2;
padding-bottom: 0;
padding-left: 2;
/* 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: 8.2em;
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
background: #FFF;
border: 1px solid #000000;
width: 210px;
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
padding: 0.5em 0.75em;
text-decoration: none;
/* Menu items that have mouse over or focus have a blue
background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #C40000;
/* 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
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-repeat: no-repeat;
background-position: 95% 50%;
/* 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-repeat: no-repeat;
background-position: 95% 50%;
Thanks so much! Ann

Hi,
Sorry because I can't understand very well English and
perhaps I will answer something that ... you know...
But I tried your code, all like you have on your web, but
adding the "BROWSER HACKS: the hacks below should not be changed
unless you are an expert", and it works on IE6, IE7, FF2. Yes,
without that, on IE6, the page breaks.
You only need to add the last fragment that I understand you
have deleted. It works without any other modification on css. You
can update your version 1.4 to 1.6 too.
I hope that I have understood all well.

Spry submenus overlap menu in Internet Explorer

Hi, I'm working on a spry menu, and it looks exactly how i want it in Firefox, but in Explorer my submenus shift to the left and overlap my menu a lot.
Also on my horizontal menu, the whole menu shows up shifted to the left and to the top in Explorer
Here's the website
http://myareasbest.com/MI%20cities/Traverse-City.html
Heres my code for the vertical menu
@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: 12px;
    cursor: default;
    width: 12em;
    border: none;
/* 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
    list-style-type: none;
    font-size: 12px;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 12em;
    font-family: Verdana;
    font-style: normal;
    font-weight: bold;
    border: 2px solid #003399;
    height: 1.5em;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
/* 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
    list-style-type: none;
    font-size: 12px;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 12em;
    left: -1000em;
    top: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 75px;
    font-family: Verdana;
    font-style: normal;
    font-weight: bold;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 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;
    left: 75px;
    top: 5px;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
    border: none;
/* Submenu containers have borders on all sides */
ul.MenuBarVertical ul
    border: none;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    background-color: #01ACE2;
    color: #ffffff;
    text-decoration: none;
    height: 7px;
    width: 12em;
    padding-top: 0.5em;
    padding-right: 0;
    padding-bottom: 0.5em;
    padding-left: 0em;
    font-size: 100%;
/* 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: #003385;
    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: #003385;
    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;
Code for horizontal menu
@charset "UTF-8";
/* SpryMenuBarHorizontal.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, 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: relative;
    text-align: left;
    cursor: pointer;
    width: 160px;
    float: left;
    left: 200px;
    top: 0px;
    height: 30px;
/* 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: 160px;
    position: relative;
    left: -1000em;
        top: 0px;
/* 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: -200;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    width: 10em;
/* 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: 0;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
    border: 0;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-color: #01ACE2;
    padding: 0.5em 0.75em;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: bold;
    text-align: center;
    font-size: 16px;
    border: 2px solid #003399;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    background-color: #003385;
    color: #FFF;
/* 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
    background-color: #003385;
    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.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* 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(SpryMenuBarDownHover.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 ul 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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: left;
        background: #FFF;

Please address the following first http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmyareasbest.com%2FMI%2520cities%2 FTraverse-City.html

Horizontal Spry submenus not dropping

I created a horizontal spry menu for this site just as I have always done. but the dropdown submenus are not working. I have tried commenting out other "functional" pieces of code. I even put a spry meny into a blank document and uploaded it. I cannot figure out what I've done wrong. Any help would be great.
You can see the page at http://www.rimshotcreative.com/test/web.html
Here is the code:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Rimshot Creative…Web Design, E-Commerce, Custom Web Development. Helping you find your groove.</title>
<link href="RC.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="wt-rotator.css"/>
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
</style>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<style type="text/css">
<style type="text/css">
h1,h2,h3,h4,h5,h6 {
          font-family: Verdana, Geneva, sans-serif;
h4 {
          font-size: 40px;
          color: #FFF;
body,td,th {
          font-family: Verdana, Geneva, sans-serif;
h1 {
          color: #C00;
body {
          background-image: url(Images/Secondary-backgrounds_01.jpg);
          background-repeat: repeat-x;
</style>
</head>
<body>
<div class="container2">
<div class="Shadow">
<div class="header"><a href="default.html"><img src="Images/RC-header_03.jpg" width="401" height="83" alt="Rimshot Creative Logo - web design, print design, social networking, marketing, seo, printing, & photography"></a><img src="Images/RC-header_04.jpg" width="291" height="83" alt="Rimshot Creative - "><img src="Images/RC-header_05.jpg" alt="Rimshot Creative - Free Consultation, call now (615) 482-5182" width="324" height="83"></div>
<div class="main-image">
     <img src="Images/Exceptional-Design.png" width="631" height="293" alt="Exeptional Web Design"> </div>
<div class="menu">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="default.html" title="Home Page">home</a>        </li>
      <li><a href="web.html" title="web services" class="MenuBarItemSubmenu">web services</a>
        <ul>
          <li><a href="web.html" title="web design services">web design</a></li>
          <li><a href="seo.html" title="search engine marketing">seo</a></li>
          <li><a href="social.html" title="social media consultation">social media</a></li>
          <li><a href="email.html" title="email marketing">email marketing</a></li>
          <li><a href="hosting.html" title="web/email hosting">hosting</a></li>
        </ul>
      </li>
      <li><a href="print.html" title="print design services" class="MenuBarItemSubmenu">print services</a>
        <ul>
          <li><a href="print.html" title="print design services">print design</a>            </li>
          <li><a href="printing.html" title="printing services">printing</a></li>
          <li><a href="marketing.html" title="marketing services">marketing</a></li>
        </ul>
      </li>
      <li><a href="photography.html" title="photography">photography</a></li>
      <li><a href="gallery.html" class="MenuBarItemSubmenu">galleries</a>
        <ul>
          <li><a href="web_gallery.html" title="See Some of the Web Sites We've Built">web gallery</a></li>
          <li><a href="print_gallery.html" title="See Some of Our Print Design Work">print gallery</a></li>
          <li><a href="photography_gallery.html" title="See Some of Our Photography">photo gallery</a></li>
        </ul>
      </li>
<li><a href="#" title="rimshot blog">blog</a></li>
<li><a href="resources.html" title="resources">resources</a></li>
<li><a href="testimonials.html" title="testimonials">testimonials</a></li>
    </ul>
</div>
    <div class="right_column">
      <p><a href="Contact Form.html"javascript:void( window.open('http://form.jotform.us/form/21766576593165', 'blank','scrollbars=yes,toolbar=no,width=700,height=500'))</a><img src="Images/Free-Consultation-Button.png" width="252" height="57" alt="Request a Free Consultation from Rimshot Creative"></a></a><a href="http://www.bnitennessee.com/tn-middle-tennessee-(nashville)-focused-around-business-succes s/"><img src="Images/proud-member-grey.jpg" width="131" height="131" alt="Proud Member of BNI Focused Around Business Success Chapter - Columbia TN"></a></p>
<p><a href="http://www.thumbtack.com/tn/brentwood/print-designers/#sort=popularity&hilite=3h88FmCa:V9o kA" title="Web & Print Design Services" style="background: url(http://cdn-1.thumbtackstatic.com/media/elite_1.png) no-repeat; color: #a5a196; padding: 195px 0 0; border:0; font-size: 13px; font-family: Georgia, 'Times New Roman', Times, serif; text-align: center; text-decoration: none; display: inline-block; width:120px; line-height:15px;"><img src="http://cdn-1.thumbtackstatic.com/media/elite_1.png" style="display: none;" />Web Design, Print Design, Photography, Brentwood, Columbia, Franklin, Spring Hill, TN</a><br />
      </p>
      <h2>Follow or Share…<br />
        <a href="http://www.facebook.com/pages/Rimshot-Creative/251035548260903" target="_new"><img src="Images/facebook button.png" width="32" height="32" alt="Follow Rimshot Creative on Facebook" longdesc="http://www.facebook.com/profile.php?id=100002963257842" /></a><a href="https://twitter.com/rimshotcreative" target="_new"><img src="Images/twitter button.png" width="32" height="32" alt="Follow Rimshot Creative on Twitter" longdesc="https://twitter.com/#!/belleforest" /></a><a href="http://www.linkedin.com/in/rimshotwebdesign" target="_new"><img src="Images/linkedin.png" width="32" height="32" alt="Join Rimshot Creative on Linked In"></a><a href="http://pinterest.com/rimshotcreative/" target="_new"><img src="Images/pinterest.png" width="32" height="32" alt="Start Pinning with Rimshot Creative on Pinterest"></a><a href="https://plus.google.com/101386322992063777741/posts" target="_new"><img src="Images/googleplus.png" width="32" height="32" alt="Join Rimshot Creative's circle on Google Plus"></a><a href="http://youtu.be/75_xggIkLyk?hd=1" target="_new"><img src="Images/YouTube button.png" width="32" height="32" alt="Check out Rimshot Creative videos on YouTube"></a>
        <p>
          <a href="https://plus.google.com/106267434027606674910/about?gl=US&hl=en-US" target="_new"><img src="Images/Google-Review-Button-No-Shadow.png" width="188" height="47" alt="Leave a review for Rimshot Creative on Google Places" /></a>
        <a href="http://local.yahoo.com/info-14947707"><img src="Images/Yahoo-Review-Button-No-Shadow.png" width="188" height="47" alt="Leave a review for Rimshot Creative on Yahoo Local" /></a></h2>
      <p>Rimshot Creative helps businesses find their groove through web design, print design, social networking, marketing, search engine optimization, printing, web and email hosting and photography in Nashville, Brentwood, Franklin, Thompsons Station, Spring Hill, Columbia, Mount Pleasant, Lewisberg, Hoenwald, Hampshire and all over Middle Tennessee.<br>
        <br>
      </p>
      <hr size="1">
      <p><strong><br>
        Rimshot Creative</strong><br>
      3313 Booker Farm Road<br>
      Mount Pleasant, TN 38474<br>
      Phone: (615) 482-5182<br>
      Fax:
      (615) 752-5956<br>
      <br>
      </p>
    </div>
    <div class="left_column">
      <h1> Get Your Groove On!</h1>
<p>Helping businesses find their groove is exactly what we try to do every day.</p>
      <h2>Layout</h2>
      <p>Since this is a one-column layout, the .content is not floated. </p>
      <h3>Logo Replacement</h3>
      <p>An image placeholder was used in this layout in the .header where you'll likely want to place a logo. It is recommended that you remove the placeholder and replace it with your own linked logo. </p>
      <p> Be aware that if you use the Property inspector to navigate to your logo image using the SRC field (instead of removing and replacing the placeholder), you should remove the inline background and display properties. These inline styles are only used to make the logo placeholder show up in browsers for demonstration purposes. </p>
      <p>To remove the inline styles, make sure your CSS Styles panel is set to Current. Select the image, and in the Properties pane of the CSS Styles panel, right click and delete the display and background properties. (Of course, you can always go directly into the code and delete the inline styles from the image or placeholder there.)</p>
    </div>
    <div class="footer">
      <p>Footer</p>
      </div>
      </div>
      
</div>
<div class="addthis_bar addthis_bar_vertical addthis_bar_medium" style="top:200px;left:25px;">
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
        <span><a class="addthis_button_preferred_1"></a></span>
        <span><a class="addthis_button_preferred_2"></a></span>
        <span><a class="addthis_button_preferred_3"></a></span>
        <span><a class="addthis_button_preferred_4"></a></span>
        <span><a class="addthis_button_compact"></a></span>
    </div>
</div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=[YOUR PROFILE ID HERE]"></script>

Thanks for your help.
It is not even on my local files. I would have thought that Dreamweaver would have created that in my local files. I can copy it over from one of my other sites.
1. Do you have any idea why it would not have been created?
2. What would be a way to resolve this if I didn't have this file on some of my other sites?
3. How did you determin that the file was not found on the server. I haven't seen any errors with any of the tools that I've used to analyse the site.

Images in video become over saturated when exported

When I export the project as an AVI the images in the video become over saturated, ie the skin tone of people becomes bright orange in some cases. Is there a setting to prevent this happening?

andrew
Grand ideas or major duds...let us try the two different tests to see if we can pin point where the issue originates and its cause....
You may want to work from a copy of the problematic project....See File Menu/Save A Copy)
Open your existing project (the one that is yielding your DV AVI 4:3 @ 29.97 interlaced frames per second, and displaying with color issues).
But, do not export this project's Timeline using Publish+Share/Computer/AVI with Presets = DV NTSC Standard as you have been doing, assumed
with no export settings customization under the Advanced Button of the preset.
1. Go to Expert workspace File Menu/Project Archiver and its Archive and Copy options. Project Archive the project with the Copy option. This will result in a "Copied....Folder" saved to the computer hard at the location that you designated. Open the "Copied....Folder" to see copies of the source media that went into the project. These copies will represent all the source media that went into Project Assets whether they were used on the Timeline or not. Open each to determine if there is any color issues with any.
on to second test....
2. Go to Timeline Menu and select and click on Delete Rendered Files to do just that. Next, render the Timeline content by pressing the Enter key of the computer main keyboard. All video previews generated from Timeline rendering of a SD project are DV AVI files, be the files being previewed photos or videos.
Next, go to the Adobe Premiere Elements Preview Files Folder (by default in Windows' Document/Adobe/Premiere Elements/12.0) and open that folder. Play back the preview files there to determine if they have color flaws.
Please let us know the outcome.
Thanks.
ATR

Inserting an image (jpg or gif) into spry widget

creating a simple Spry dropdown menu.
After excessive CSS tweaking, everything looks good except
for being able to display 2 gifs (one when the menu is viewed and
one when the mouse hovers over the menu item).
Is it possible to insert these gifs into the menu? or do I
need to look somewhere else?
Thanks

Not a problem. I just wanted to make sure you had a little
understanding before diving too far in.
First thing you should have open while doing this is your
document (just so you can see what is going on) and the
SpryMenuBarHorizontal.css since I assume you are using a Horizontal
menu, but if this is wrong feel free to correct me.
Now first take note this example is the third one. Then in
the source code you will see the a group of code near the top with
4 parts that begin with #MenuBar3. Now when you look at your CSS
document (the one you previously opened) you will see that
everything begins with ul.MenuBarHorizontal. This is actually a
reference to the same item. To explain this look at the following
example in the source code from the third link:
#MenuBar3 a.MenuBarItemHover, #MenuBar3
a.MenuBarItemSubmenuHover, #MenuBar3 a.MenuBarSubmenuVisible {
background-image: url(images/itemgradient-hover.gif);
background-repeat: repeat-x;
Now on line 104 (assuming you have not changed anything too
much) you should see the same beginning, but instead of #MenuBar3
you will see ul.MenuBarHorizontal. The default attributes for that
area are a background-color and foreground color. Images will
always overwrite colors so you can just paste what is in between
the { } from the source code of the Adobe page to your CSS page.
Obviously the URL will change to the path to your own image. Now if
something doesn't exist like this part from the Adobe source:
#MenuBar3 li a {
background-color: transparent;
Just make your own CSS entry in that document with the
substitution mentioned before. So you would end up with:
ul.MenuBarHorizontal li a {
background-color:transparent;
Unfortunately this is the way these types of menus are done
although I would suspect since the Spry is only listed as beta at
this point it is to be expected. Hopefully this has made some sense
to you. If not feel free to post back and I would be glad to
explain this further.

Images in IE Render over Spry SubMenus

Similar Messages

Maybe you are looking for