CSS Dropdown menu for the header- With Categories!

[abebakker]

I installed the dropdown menu and it worked perfect.
But since I upgrade Internet Explorer 6 to Internet Explorer 7 I've a problem.

- ZenCart 1.3.7
- DropdownMenu 1.3

The dropdown menu works fine in Firefox and IE6

There is a problem with DropdownMenu in IE7:
The menu shows empty submenu's if you move your mouse over the menu and drop down some levels, then move your mouse out of the menu and back on the toplevel. I hope you understand this explanation.

Just to be clear I will try to make a Screenprint and post it.

I see this problem also on the apple zen example site and other site's that use the DropdownMenu.

Does anyone know how to fix this.
Thanx.

[jettrue]

I installed the dropdown menu and it worked perfect.
But since I upgrade Internet Explorer 6 to Internet Explorer 7 I've a problem.

- ZenCart 1.3.7
- DropdownMenu 1.3

The dropdown menu works fine in Firefox and IE6

There is a problem with DropdownMenu in IE7:
The menu shows empty submenu's if you move your mouse over the menu and drop down some levels, then move your mouse out of the menu and back on the toplevel. I hope you understand this explanation.

Just to be clear I will try to make a Screenprint and post it.

I see this problem also on the apple zen example site and other site's that use the DropdownMenu.

Does anyone know how to fix this.
Thanx.

This is a known issue, and I haven't been able to find a resolution to it. So you have to decide whether or not you can live with the issue. Sorry!

[abebakker]

This is a known issue, and I haven't been able to find a resolution to it. So you have to decide whether or not you can live with the issue. Sorry!

Thanx for the fast reaction. Then I have to live with it.

[mauryg]

Jettrue,

I thought I had this nice menu all worked out, aside from playing with the spacing and widths for different browsers, but then I tried it with IE 5.5 and IE6 and the drop downs do NOT work at all. Only the level 1 menu is active.
I know that IE6 and earlier do not support the :hover pseudo class and I suspect that this is the problem. I don't think I want to start rewriting the code to include the Suckerfish javascript. What do you think?
Latest W3Schools stats say that IE6 is about 50% of the browsers. Yikes!
Maury

[jettrue]

Jettrue,

I thought I had this nice menu all worked out, aside from playing with the spacing and widths for different browsers, but then I tried it with IE 5.5 and IE6 and the drop downs do NOT work at all. Only the level 1 menu is active.
I know that IE6 and earlier do not support the :hover pseudo class and I suspect that this is the problem. I don't think I want to start rewriting the code to include the Suckerfish javascript. What do you think?
Latest W3Schools stats say that IE6 is about 50% of the browsers. Yikes!
Maury

Did you upload includes/csshover.htc? Did you make your additions to .htaccess? I didn't create a menu that wouldn't work in ie6.

[mauryg]

The answers to your questions are yes, yes and yes.
I did read the readme...
I added the csshover.htc file to the root/includes/ directory...
I added the lines to .htaccess in the root/includes/ directory...
Since I have IE7 installed as my IE browser, I am running separate "standalone" copies of IE6 and IE5.5 (www.tredosoft.com), but I don't think this is the cause of the problem. I felt sure you had tested the menu in IE6 and I just don't understand what happened. I am using "CSS Flyout Header for Zen Cart 1.3.* v1.2".
I will PM you a link to the website since it is not open to the public yet.
As always, thanks for your help and the rapid response.

Maury

[jettrue]

The answers to your questions are yes, yes and yes.
I did read the readme...
I added the csshover.htc file to the root/includes/ directory...
I added the lines to .htaccess in the root/includes/ directory...
Since I have IE7 installed as my IE browser, I am running separate "standalone" copies of IE6 and IE5.5 (www.tredosoft.com), but I don't think this is the cause of the problem. I felt sure you had tested the menu in IE6 and I just don't understand what happened. I am using "CSS Flyout Header for Zen Cart 1.3.* v1.2".
I will PM you a link to the website since it is not open to the public yet.
As always, thanks for your help and the rapid response.

Maury

You removed this from your stylesheet_header_menu.css:

body {
behavior: url(includes/csshover.htc);
}

You're menu also wraps onto two lines in Firefox, you may want to increase the width from 55 em a bit.

[mauryg]

Jade,
I just ran into the problem of the empty submenus in IE7. Back in post #492 you said

This is a known issue, and I haven't been able to find a resolution to it. So you have to decide whether or not you can live with the issue. Sorry!

Any further resolution of the problem?

Second question: I tried to add a regular level2 link between the heading of the categories and the categories listing from the ul_generator.

<li class="submenu"><a href="<?php echo DIR_WS_CATALOG. '#'; ?>"><?php echo HEADER_TITLE_CATEGORIES; ?></a>
<ul class="level2">
<li class="submenu"><a href="<?php echo DIR_WS_CATALOG. 'index.php?main_page=page&amp;'.'id=30&amp;chapter=0'; ?>">Products</a></li>
</ul>
<?php
// load the UL-generator class and produce the menu list dynamically from there
require_once (DIR_WS_CLASSES . 'categories_ul_generator.php');
$zen_CategoriesUL = new zen_categories_ul_generator;
$menulist = $zen_CategoriesUL->buildTree(true);
$menulist = str_replace('"level4"','"level5"',$menulist);
$menulist = str_replace('"level3"','"level4"',$menulist);
$menulist = str_replace('"level2"','"level3"',$menulist);
$menulist = str_replace('"level1"','"level2"',$menulist);
$menulist = str_replace('<li class="submenu">','<li class="submenu">',$menulist);
$menulist = str_replace("</li>\n</ul>\n</li>\n</ul>\n","</li>\n</ul>\n",$menulist);
echo $menulist; ?></li>

It wouldn't work. Any ideas?

[jettrue]

Jade,
I just ran into the problem of the empty submenus in IE7. Back in post #492 you said

Any further resolution of the problem?

Second question: I tried to add a regular level2 link between the heading of the categories and the categories listing from the ul_generator.

It wouldn't work. Any ideas?

Yeah, that won't work.....

You *could* try this, but I don't know if it will work either. open up includes/classes_categories_ul_generator.php and change this:

$parent_group_start_string = '<ul%s>',

to this:

$parent_group_start_string = '<ul%s> <li class="submenu"><a href="<?php echo DIR_WS_CATALOG. 'index.php?main_page=page&amp;'.'id=30&amp;chapter =0'; ?>">Products</a></li>',

[mauryg]

Nope, that didn't work. It killed the page right after the level1 header button.