Wayfinder double menu entries on IE6

Couple of questions if I may. Well couple of issues one of which has got me close to launching my laptop across the room. All no doubt my fault though. I’m trying to implement the flyout menu from the examples. Pretty much exactly the same as it is in the example except mine is almost good.

On ie6 there is a specific piece of code for css_playParentRow

<li><a [+wf.classes+] href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a>
<!--[if lte IE 6]>
<a class="sub" href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]
<table><tr><td>
<![endif]-->
[+wf.wrapper+] entries is dead
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>

This is what is appearing to give me double entries in the menu. One of the entries is dead the other has the sub menu. I also get a load of whitespace in body of my site which is the same size as the menu i.e the menu appear to trickle into the body of the site. Maybe that’s a width of menu in the stylesheet thing.

The other one is I have a bottom margin on my menu items of 1px which works fine on everything but IE7 in which case the menu disappears as you hit the pixel. Tempting as it is to have a sign on my site that says ’if you running IE then you deserve to have a crap surfing experience’ I don’t think I can. Everything is fine in Firefox and logically it looks right in IE7. I did try the flyout revisited example but I get nowhere with it. I just get a bulleted list.

Any ideas on the above?

did you use the css specialy made for ie6? for ie6 only you need to set .hide{display:none;}

Here’s the flyout_ie.css

table {border-collapse:collapse; border:0; margin:0; padding:0;}

.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}

.menu ul li a:hover {color:#fff; background:#AFB685 url(img/left_arrow_over.gif) bottom right no-repeat;}
.menu ul li a:hover ul {display:block; position:absolute; top:0; left:150px; width:145px;}
.menu ul li a:hover ul li a.sub {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a {display:block; background:#AFB685 url(img/left_arrow_over.gif) bottom right no-repeat; color:#ffffff; width:145px;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#CCE57F url(img/left_arrow_over2.gif) bottom right no-repeat; color:#ffffff;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:150px; top:0; color:#000;}
.menu ul li a:hover ul li a:hover ul li a {display:block; width:145px; background:#AFB685 url(img/left_arrow_over.gif) bottom right no-repeat; color:#ffffff;}
.menu ul li a:hover ul li a:hover ul li a:hover {background:#CCE57F url(img/left_arrow_over2.gif) bottom right no-repeat; color:#ffffff;}

another thing you could do if you are using wf2.x call wayfinder like this [!wayfinder? &config=`cssplay-flyoutrev`!]

this version does not need a seperate ie6 css and the config way of using wayfinder is much nicer the config files contain all the data normaly in the call and in the used chunks. they can be found in you assets/snippets/wayfinder/configs folde r(wayfinder2.x needed for this)

greets Dimmy

I did try this one and it just wouldn’t work. It’s working nicely for me now though. I called all the config through chunks as the config file didn’t want to work for me. Again, likely something I’m doing wrong. I believe the reason it wasn’t working for me was because the example on Muddydogpaws.com for flyout revisited misses off the config items &outerTpl=`cssplay_outer` &outerClass=`menu`.

Obviously, this is me not understanding how it works properly. However, had you not pointed out the config file I wouldn’t have been able to resolve this. Many thanks for you help.

The trouble with the double entries in ie6 is that ie if not 7 also writes the code not intended for it to the screen. so this piece:



So i’ve used conditional comments. So the above code will only be written if the browser is not IE or IE7 and later (ofcourse the latter is important because future ie versions will stil come out)



Be shure not to use <!-- as comment, this will not work in FF, opera and others.

For more info on this subject check: http://msdn2.microsoft.com/en-us/library/ms537512.aspx

i’m still working on the white space in the body. But i guess the same trick can be applied in the css