Glossy Accordion Menu

[quadrant]

Hi,

Scritp URL:http://www.dynamicdrive.com/dynamici...enu-glossy.htm

I am setting up the Glossy Accordion Menu on a new site and it looks great in Firefox and IE. I am close to finishing the site and thought I better check it in Safari and the plus.gif does not show in Safari 2 which is obviously a big problem as the content doesn't show as the menus cannot be expanded.

Has any one else had this problem? Some advice would be much appeciated.

Regards,

David

[jscheuer1]

Not that there is necessarily anything wrong with testing in Safari 2, I'm curious as to why you would bother. Safari 3 has been out for quite some time with several updates of its own under its belt and is much more compliant to standards.

That said, most folks around here are PC users, so there isn't a big chance that someone else here would have experienced the same issue, especially considering that it may be your implementation or browser setup, not the script.

The demo page from DD works fine as regards the + image here in Safari 3 Win.

If I could have a link to your page I could test it in Safari 3 Win at least - to see if I could shed any light upon what you are reporting.

[quadrant]

Hi jscheuer1,

Thank you for your reply. I understand what you mean about old browsers and I too have since tested it in Safari 3 and see that it works. The reason why the Safari 2 question came up is because according to the existing site web stats there are still people using Safari 2 and IE6 who visit the site. It is frustrating when people don't upgrade as it makes our lives harder!

Last week 7.80% of the visitors used IE6. I have noticed that the padding around the menu links is a lot more in IE6 and the menu falls off the bottom of the page but is fine in FF, IE8 and Safari 3. Is there a style I can apply to control this?

Thanks.

[jscheuer1]

In IE 6 here, the demo on Dynamic Drive doesn't appear any differently. Often empty text nodes and/or line breaks in the source code can have an influence on what might appear to be a padding issue in IE 6.

You may also always resort to a supplemental stylesheet for any, some, or all IE browser versions starting with 5. For instance one may place tags like these (a stylesheet link surrounded by the IE proprietary conditional comment tag - this one's set for 'if less than IE 7'):

<!--[if < IE 7]>
<link rel="stylesheet" href="ie_6.css" type="text/css">
<![endif]-->

after your other styles and/or stylesheet links in the head of the page. In the ie_6.css file, you only need to include styles that you wnt to be different than those already declared in your other style section(s)/sheet(s).

However, if you are testing in what is known as a 'Standalone' version of IE 6 with a later version of that browser also installed on the machine, depending upon how you installed the Standalone, it may or may not follow these styles. Anyone with IE 6 as the only IE browser will get the benefit of these supplemental styles.

Also, 7.8% is pretty small. A number of those are probably other browser that are merely spoofing IE 6 to gain access to sites that might require it (this was very big a number of years ago - many folks never changed their settings). Their browsers will still use their native rendering engine and will not follow the directives in a supplemental stylesheet - all non IE browsers see the code around the link as a comment tag.