IE7 DropDown Menu stays dropped.

[dorayme]

Under specific conditions, I have noticed a problem in IE7 with a
popular dropdown method. In IE7, the dropdown fails to spring back up if
you focus on another app or window and come back to the doc with the
dropdown. Anyone come across this who can suggest a simple solution or
find where such is outlined please? I have tried to isolate the problem
as best as I can and this url also explains the conditions:

<http://dorayme.890m.com/alt/IE7DDFocusProblem.html>

 

[cwdjrxyz]

Under specific conditions, I have noticed a problem in IE7 with a
popular dropdown method. In IE7, the dropdown fails to spring back up if
you focus on another app or window and come back to the doc with the
dropdown. Anyone come across this who can suggest a simple solution or
find where such is outlined please? I have tried to isolate the problem
as best as I can and this url also explains the conditions:

<http://dorayme.890m.com/alt/IE7DDFocusProblem.html>

Yes, I see a bad case of "hangitus" on IE7 as you describe. The latest
versions of Firefox, Flock, Opera, Safari for Windows, Google Chrome ,
K -Meleon, and SeaMonkey do not hang up. I have no idea what is
causing the problem in IE7, and I do not know how anyone not with
Microsoft could find out because Microsoft OS code is not open source.
My prime suspect would be the Microsoft OS JavaScript engine, since
the menus are run by script. It appears that you likely will have to
use Microsoft conditional comments to do something different for IE,
if the problem spoils your page, or come up with some other method,
perhaps PHP on the server.

 

[dorayme]

Yes, I see a bad case of "hangitus" on IE7 as you describe. The latest
versions of Firefox, Flock, Opera, Safari for Windows, Google Chrome ,
K -Meleon, and SeaMonkey do not hang up. I have no idea what is
causing the problem in IE7, and I do not know how anyone not with
Microsoft could find out because Microsoft OS code is not open source.
My prime suspect would be the Microsoft OS JavaScript engine, since
the menus are run by script. It appears that you likely will have to
use Microsoft conditional comments to do something different for IE,
if the problem spoils your page, or come up with some other method,
perhaps PHP on the server.

I was startled to see this effect when I walked around to a friend who
had XP and IE7 (must get cracking to upgrade my Winbox).

Actually, one thing I do not know for sure because it was not exactly
clear from my reading of this technique was whether IE7 actually needed
the javascript addition. IE 6 certainly does and this problem does not
occur on Win 2000 with IE6.

But if IE7 does not need it, it would be easy to hide the script from
it. Perhaps IE7 did expand its hover capabilities (after IE6's
limitations in this regard)? Perhaps you would be so kind as to tell me
if the menu simply does not drop at all or does not exhibit the problem
with:

<http://dorayme.890m.com/alt/dropDownSansScript.html>

 

[cwdjrxyz]

I was startled to see this effect when I walked around to a friend who
had XP and IE7 (must get cracking to upgrade my Winbox).

Actually, one thing I do not know for sure because it was not exactly
clear from my reading of this technique was whether IE7 actually needed
the javascript addition. IE 6 certainly does and this problem does not
occur on Win 2000 with IE6.

But if IE7 does not need it, it would be easy to hide the script from
it. Perhaps IE7 did expand its hover capabilities (after IE6's
limitations in this regard)? Perhaps you would be so kind as to tell me
if the menu simply does not drop at all or does not exhibit the problem
with:

<http://dorayme.890m.com/alt/dropDownSansScript.html>

Again, all browsers mentioned for the first url also work properly for
this new url. However IE7 does not display the items at all when you
hover. Rather it only gets the not found site at http://error.000webhost.com/not_found.html
when you click head. It does appear that IE7 needs the script.

Since IE7 can be so strange at times, I will mention that I am using
the ATT/Yahoo DSL version of it that this isp provides. So far as I
can tell, it only uses a different home page with links to Yahoo mail
etc. It seems to be just IE7 with a different home page.

 

[Els]

Again, all browsers mentioned for the first url also work properly for
this new url. However IE7 does not display the items at all when you
hover. Rather it only gets the not found site at http://error.000webhost.com/not_found.html
when you click head. It does appear that IE7 needs the script.

Since IE7 can be so strange at times, I will mention that I am using
the ATT/Yahoo DSL version of it that this isp provides. So far as I
can tell, it only uses a different home page with links to Yahoo mail
etc. It seems to be just IE7 with a different home page.

I too saw the effect, or rather, the absence of it, so I fiddled a
bit, and found this: your first code, for .dropDownNav, .dropDownNav
ul, should *not* have the list-style:none;.
Don't ask me why, I can't think of any other reason than a bug of some
sort. While this fixes the problem, I found that taking *off* the
list-style:none; from your style for .dropDownNav li:hover ul, would
bring it back. Looks like a very weird bug...

 

[dorayme]

... IE7 does not display the items at all when you
hover. ...It does appear that IE7 needs the script.

As I originally thought then, thanks. I have since posted to a
javascript group to see if anyone might think of a different script and
if this solved the problem for IE7 I would not have to worry whether
such a script worked for below IE7 because I could then deliver just
this to IE7, the other would do the rest, and the rare or old browsers
that worked not at all to drop the menu (Mac IE5) can be content without
it.

 

[Els]

As I originally thought then, thanks. I have since posted to a
javascript group to see if anyone might think of a different script and
if this solved the problem for IE7 I would not have to worry whether
such a script worked for below IE7 because I could then deliver just
this to IE7, the other would do the rest, and the rare or old browsers
that worked not at all to drop the menu (Mac IE5) can be content without
it.

IE7 does not need the script - just a bug fix:
http://locusmeus.com/temp/ie7dropdown.html

 

[Els]

I too saw the effect, or rather, the absence of it, so I fiddled a
bit, and found this: your first code, for .dropDownNav, .dropDownNav
ul, should *not* have the list-style:none;.
Don't ask me why, I can't think of any other reason than a bug of some
sort. While this fixes the problem, I found that taking *off* the
list-style:none; from your style for .dropDownNav li:hover ul, would
bring it back. Looks like a very weird bug...

I think it's related to the same bug that caused hover effects on
linked images to be absent in IE6. The fix for that one, was to change
any visual style on the hovered element, which would trigger the
visual style for the child element.

Now, with this bug in IE7, it's almost the same, in the sense that it
needs a trigger. If I set the list-style for the UL to 'none', and I
don't change that on hover, the LI elements won't show.

The only thing needed to make it work, is to set a certain property
value different for UL and li:hover UL.
Differences that I found work:
border
background-position
list-style-position
list-style-type
list-style-image
line-height
font-size
and probably plenty more.
The only thing that doesn't seem to have effect afaics, is color and
background-color.

 

[dorayme]

I too saw the effect, or rather, the absence of it, so I fiddled a
bit, and found this: your first code, for .dropDownNav, .dropDownNav
ul, should *not* have the list-style:none;.

Should have typed list-style-type: none;

Thanks Els.

Don't ask me why, I can't think of any other reason than a bug of some
sort. While this fixes the problem, I found that taking *off* the
list-style:none; from your style for .dropDownNav li:hover ul, would
bring it back. Looks like a very weird bug...

I have housekept a couple of things in the test case but am not near an
XP machine to see if the same phenomenon is occurring?

 

[dorayme]

IE7 does not need the script - just a bug fix:
http://locusmeus.com/temp/ie7dropdown.html

After your last post indicating trouble with list-style shorthand
instruction I rearranged it to be list-style-type: none;

But to be clear now, is the problem happening with:

<http://dorayme.890m.com/alt/IE7DDFocusProblem.html.

but not with:

<http://dorayme.890m.com/alt/IE7DDFocusProblemSansListStyleInstruction.ht
ml>

or

<http://tinyurl.com/5pbaeg>

if my newsreader mucks the url up (where is Gus who watches these things
closely? Hi Gus, if you are there...)

 

[Els]

After your last post indicating trouble with list-style shorthand
instruction I rearranged it to be list-style-type: none;

Which doesn't make a difference, since setting list-style-type:none,
would still be inherited from the UL to the li:hover UL. The trigger
is change. Any change. (but not color or background-color change in
this case).

But to be clear now, is the problem happening with:

<http://dorayme.890m.com/alt/IE7DDFocusProblem.html.

Yes, problem: list items appear, but stay down when mousing away via
the list items. (mousing away via 'head item', does collapse the lot)
Taking script off, no list items.
Tested with script left in, but taken out the first
list-style-type:none, works perfectly. drops down, collapses,
regardless of how the mouse is moved away. Proof: needs change

but not with:

<http://dorayme.890m.com/alt/IE7DDFocusProblemSansListStyleInstruction.html>

correct, works perfect. appearing, disappearing, perfect.
But it's with script. So not really proof I think?

or

<http://tinyurl.com/5pbaeg>

ah, repaired the first link already. (got broken between ht and ml)

if my newsreader mucks the url up (where is Gus who watches these things
closely? Hi Gus, if you are there...)

Macs don't have good newsreaders. Use Windows and choose 40tude Dialog
;-))

 

[Els]

I too saw the effect, or rather, the absence of it, so I fiddled a
bit, and found this: your first code, for .dropDownNav, .dropDownNav
ul, should *not* have the list-style:none;.

Should have typed list-style-type: none;[/QUOTE]

That's not the problem. The problem (as discovered after writing the
above) is that a change need to be made between the UL in normal
state, and the UL when the parent is hovered.

Thanks Els.


I have housekept a couple of things in the test case but am not near an
XP machine to see if the same phenomenon is occurring?

See other reply

 

[dorayme]

Which doesn't make a difference, since setting list-style-type:none,
would still be inherited from the UL to the li:hover UL. The trigger
is change. Any change. (but not color or background-color change in
this case).


Yes, problem: list items appear, but stay down when mousing away via
the list items. (mousing away via 'head item', does collapse the lot)
Taking script off, no list items.
Tested with script left in, but taken out the first
list-style-type:none, works perfectly. drops down, collapses,
regardless of how the mouse is moved away. Proof: needs change


correct, works perfect. appearing, disappearing, perfect.
But it's with script. So not really proof I think?


ah, repaired the first link already. (got broken between ht and ml)


Macs don't have good newsreaders. Use Windows and choose 40tude Dialog
;-))

Thanks Els for spotting these odd things about the dropdown... I will
have to look and think about it tomorrow.

Macs have some very good readers I am sure, but they cost money and you
know what my dentist charged me today for a routine clean (he decided he
should take a couple of x-rays to satisfy himself about something - at
my expense!): $230. I bet he has an expensive newsreader. (I noticed his
secretary had an iMac) <g>

 

[rf]

G'Day dorayme. How's it going over there on the other side of the rIver.

Under specific conditions, I have noticed a problem in IE7

Oh my.

with a
popular dropdown method.

Popular? I don't use it. Looked at it a while ago but it has failings.

In IE7, the dropdown fails to spring back up if
you focus on another app or window and come back to the doc with the
dropdown.

Or even if you click on any part of the body of the page, that is, not any
text or images or whatever, some of that blank space there. Focus is then on

Anyone come across this
Yep.

who can suggest a simple solution

Er, me:

Don't use left: -999em to "hide" the dropdown, It's not really hidden,
it's just over <--- there. IE has problems with this. Really hide it with
{display: none;}

and then in you whatever:hover, {display: block;}

Works for me

Cheers...

 

[Els]

Macs have some very good readers I am sure, but they cost money

Please please pretty please - can you point me to one? I didn't find
any, paid or free. If I could find an equivalent of Dialog for the
Mac, I'd happily pay for it.

All I want it to do, is display the lot in a 3 pane view (groups,
threads, messages), have a shortcut key to the next unread message
regardless of which thread or group it is in, being able to go back to
the message I read before, (and before that one, and before that one),
keep all messages for as long as my news server has them (so I can
figure out what the OP wrote even 3 days later), and have a good
threadview. I think that's all. Can't find it for Mac!

and you
know what my dentist charged me today for a routine clean (he decided he
should take a couple of x-rays to satisfy himself about something - at
my expense!): $230. I bet he has an expensive newsreader. (I noticed his
secretary had an iMac) <g>

I bet he doesn't use a newsreader. If he knows about usenet at all, it
will be Google Groups, I'm sure

No idea how much 230 Aussi (or Martian) dollars are worth in Euro
coins, but doesn't your health insurance pay for it? Mine does.
Regardless of what my dentist comes up with every time!

 

[dorayme]

G'Day dorayme. How's it going over there on the other side of the rIver.

About bloody time you came back! I could go on for ages about how things
have changed around here but I will let you settle in before indulging
in my usual sport of irritating you.

Oh my.


Popular? I don't use it. Looked at it a while ago but it has failings.


Or even if you click on any part of the body of the page, that is, not any
text or images or whatever, some of that blank space there. Focus is then on
the <body>, or perhaps the <html>, who knows.

Yes, I know, and this very thought was in my mind behind the careful
phrase in my op, "...if you focus on another app or window and come back
to the doc with the dropdown". Not the menu, the *doc*. I had noticed
that and thought it would give a clue to anyone who understood IE deeply
when they came to look at it.

Er, me:

Don't use left: -999em to "hide" the dropdown, It's not really hidden,
it's just over <--- there. IE has problems with this. Really hide it with
{display: none;}

and then in you whatever:hover, {display: block;}

Works for me

Well, I have gotten up this morning being pretty sure that Els has
spotted a line in my CSS which, though legal, is tripping IE7 up and
could be left out.

I know about the display: none route and I am sure it is not such a bad
way, you are right. But I thought, considering this was going to be my
first drop down, single level and modest and all, and not crucial to the
user, I would go for a solution that does not have the accessibility
downside of the display: none; hiding elements from some screen readers.
At least that was my thought. It was a good wholesome thought, admit it!

Not that I think your way is so bad for situations where the dropdown
part is not crucial to navigation. So, I will keep it in mind.

 

[dorayme]

... can you point me to one? I didn't find
any, paid or free. If I could find an equivalent of Dialog for the
Mac, I'd happily pay for it.

All I want it to do, is display the lot in a 3 pane view (groups,
threads, messages), have a shortcut key to the next unread message
regardless of which thread or group it is in, being able to go back to
the message I read before, (and before that one, and before that one),
keep all messages for as long as my news server has them (so I can
figure out what the OP wrote even 3 days later), and have a good
threadview. I think that's all. Can't find it for Mac!

I will get back to you on this. I know that Sally Thompson, who used to
post here a bit and a bit more on mac.apps, bought and was impressed
with Hogwasher after looking into the matter. And I have heard
Thunderbird is OK.

I bet he doesn't use a newsreader. If he knows about usenet at all, it
will be Google Groups, I'm sure

No idea how much 230 Aussi (or Martian) dollars are worth in Euro
coins, but doesn't your health insurance pay for it? Mine does.
Regardless of what my dentist comes up with every time!

Ah but this is more like a little America than cosy Europe... 10 years
of a very conservative war mongering govt ensured this. I don't have
private cover for dentistry, and so far this has been the cheapest
option because of reasonably lucky genes for teeth. And I can tell you
that when I spend 230 buckeroos on them, I protect the investment
carefully. I try not to eat or drink or fight for as long as possible.

 

[dorayme]

IE7 does not need the script - just a bug fix:
http://locusmeus.com/temp/ie7dropdown.html

OK, I take this to mean that the script is mainly useful for IE6.

In other words, even if IE7 did not see the script at all, it would
still react badly till the list style css line was removed or
deactivated (or more complicated CSS styling was added)

And the simplest fix is to remove the CSS line.

Els, I think it was very eagle-eyed of you to spot this. I also see in
your other posts how you are alerted to it: by bugs in the IE stable
that need "similar triggers", the trigger of a change in css between UL
to the li: hover UL

Thanks.

One slightly interesting matter: Look right down to your or my

..dropDownNav li:hover ul {
left: auto; list-style: none;
}

and note the instruction about bullets. If you leave this in but remove
the head bullet (by commenting it out, see towards the top of your css),
you will get one bullet for the head item and no bullets for the
dropdown items. The one bullet is being masked by the zero padding on
..dropDownNav, .dropDownNav ul. (Remove this zeroing to see the bullet).

It seems that the padding instruction is a good way to hide the bullet
and keep IE 7 happy. I suppose I could comment out the top list-style
instruction from IE 7 but let other browsers see it if I needed.

 

[Els]

Els <[email protected]> wrote:

[Mac newsreader]

I will get back to you on this. I know that Sally Thompson, who used to
post here a bit and a bit more on mac.apps, bought and was impressed
with Hogwasher after looking into the matter. And I have heard
Thunderbird is OK.

I've tried Hogwasher already, and it would almost be good. If it
weren't for not having any means whatsoever to get to the next unread
message, other than checking each thread separately and clicking on a
little circle in a separate pane, which turns into a square when the
message is read. (the groups are in a separate pane too, but these
days I only read about 3 groups, so that's not a big problem).

Thunderbird may be an option indeed, if they've fixed the double
spacing on replies since last time I checked. Will try it out again,
thanks.

[dentist costs]

And I can tell you
that when I spend 230 buckeroos on them, I protect the investment
carefully. I try not to eat or drink or fight for as long as possible.

Sometimes I *think* about being careful. Like every time I drink coke,
I think "it would be better for my teeth if I wouldn't drink this",
but that's as far as I'll go. Not taking away my fizzy drinks

 

[Els]

OK, I take this to mean that the script is mainly useful for IE6.

Yup.

In other words, even if IE7 did not see the script at all, it would
still react badly till the list style css line was removed or
deactivated (or more complicated CSS styling was added)

Yes. although in a different way than with the script I think.
With script: dropdown stays down in certain occasions.
Without script: dropdown doesn't happen at all.

And the simplest fix is to remove the CSS line.

Only because this means a change between the normal state and the
hovered one.

Els, I think it was very eagle-eyed of you to spot this. I also see in
your other posts how you are alerted to it: by bugs in the IE stable
that need "similar triggers", the trigger of a change in css between UL
to the li: hover UL

The other way round really
I keep hiding CSS rules till I find which causes it, and only after I
found this one, I saw the connection with other trigger tricks.

Thanks.

Welcome

One slightly interesting matter: Look right down to your or my

.dropDownNav li:hover ul {
left: auto; list-style: none;
}

and note the instruction about bullets. If you leave this in but remove
the head bullet (by commenting it out, see towards the top of your css),
you will get one bullet for the head item and no bullets for the
dropdown items. The one bullet is being masked by the zero padding on
.dropDownNav, .dropDownNav ul. (Remove this zeroing to see the bullet).

It seems that the padding instruction is a good way to hide the bullet
and keep IE 7 happy. I suppose I could comment out the top list-style
instruction from IE 7 but let other browsers see it if I needed.

Yes, but I think there are browsers where this may not really hide the
bullet. Forgot when/where I saw it, but I think it's better to
explicitly tell the browser to not show the bullets.
So, instead of simply commenting out the list-style:none on the normal
state and rely on zero padding, I'd instead add a value for
list-style-position in the hover state. That's enough of a trigger,
and with no bullets it doesn't even matter if you choose inside or
outside.