473,327 Members | 2,012 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,327 software developers and data experts.

li:hover - IE issue

bne
Hi,

My brain's a bit fried on this one.

I'm using the li:hover method to display sub menus at http://dev.hyl.co.uk/guide4life/.
All works swimmingly in FF, however IE7 loses the hover (and so the
sub menu) when you mouse over items further down the sub menu list.
This only seems to happen when the sub menu is over the text of a
paragraph (try further down the page eg: "Confidentiality" - it
works!?)

Any ideas?

Mar 21 '07 #1
4 19431
bne wrote:
Hi,

My brain's a bit fried on this one.

I'm using the li:hover method to display sub menus at http://dev.hyl.co.uk/guide4life/.
All works swimmingly in FF, however IE7 loses the hover (and so the
sub menu) when you mouse over items further down the sub menu list.
This only seems to happen when the sub menu is over the text of a
paragraph (try further down the page eg: "Confidentiality" - it
works!?)

Any ideas?
li:hover is not understand by IE. I use javascript for similar things in IE.

This happens in IE6. I haven't tested it in IE7 but for what you are
saying I think it's the same :-(
Mar 21 '07 #2
If you'd like to avoid using javascript, you can do it another way,
though it can be more messy, and may not be worth it over javascript.

in the LI you have set to hover on your site, instead put in

<a href='#' style='display: block; width: 100%; height: 100%;'
id='mouseOverBar'>
<ul style='display: none;'>
<li>blah1</li>
<li>blah2</li>
</ul>
</a>

With proper styling of course, and the hover set to the link. Having
a block item inside of a link, even a link set to display as a block
does throw validation warnings, but none of the current browsers will
have a problem with it. If you'd like to stop these errors you can
use spans in the link, and change their display to block, but, you'd
really only be doing it to make it validate, it wont do anything to
help a users experience.

If any of this doesn't make sense, let me know and I'll try to give
you the code for the site you linked.
On Mar 21, 9:13 am, Harris Kosmidhs
<hkosm...@remove.me.softnet.tuc.grwrote:
bne wrote:
Hi,
My brain's a bit fried on this one.
I'm using the li:hover method to display sub menus athttp://dev.hyl.co.uk/guide4life/.
All works swimmingly in FF, however IE7 loses the hover (and so the
sub menu) when you mouse over items further down the sub menu list.
This only seems to happen when the sub menu is over the text of a
paragraph (try further down the page eg: "Confidentiality" - it
works!?)
Any ideas?

li:hover is not understand by IE. I use javascript for similar things in IE.

This happens in IE6. I haven't tested it in IE7 but for what you are
saying I think it's the same :-(

Mar 21 '07 #3
bne
Hi Harris,

Thanks for your help.
On 21 Mar, 14:13, Harris Kosmidhs <hkosm...@remove.me.softnet.tuc.grwrote:

li:hover is not understand by IE. I use javascript for similar things in IE.

This happens in IE6. I haven't tested it in IE7 but for what you are
saying I think it's the same :-(

IE7 started (thankfully) to support the :hover pseudo class, and for
versions 6 and below I use a script which spoofs the same
functionality.

My question really was if anyone could see why hovering over the
nested list items when they are over a paragraph should knock out the
hover effect?

It's got to be some display or z-index issue, but I can't see it.

Ben

Mar 22 '07 #4
bne
Hi Elephant,
On 21 Mar, 20:28, "elephant" <matt.mi...@gmail.comwrote:
If you'd like to avoid using javascript, you can do it another way,
though it can be more messy, and may not be worth it over javascript.
I did think about going down this path, but there are validation and
accessibility considerations.

As it turns out I've just heard the client wants to ditch the popout
menu idea anyway - Problem solved :)

Thanks for your help

Ben

Mar 22 '07 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
by: mike | last post by:
I wonder if someone would be kind enough to enlighten me about the use of the > character in a stylesheet. E.g. li:hover > ul {display: block;} I think I know what the > achieves by looking at...
13
by: windandwaves | last post by:
Hi Folk Just a bit of help here for newbies who want their menus to look nicer. I am sure that many of you make menus like this <ul id="menu"> <li><a href="page1.html">option 1</a></li>...
3
by: lewisthesmith | last post by:
I'm not really sure if this is a CSS issue, but people here before have been knowledgeable and friendly and so it seems like a good place to start. I'm in the process of building a new site for...
6
by: adz1809 | last post by:
I have created this horizontal dropdown menu in css which is working fine in IE6+ but isn't firefox, and I have no idea why. here is the code: HTML: <body id="our-travels" class="home"> <div...
3
by: noize | last post by:
I have found other bugs related to using hover is CSS with IE, but I cannot find a fix for my issue. I have checked it in both IE 6 & 7 with the same results. I have built a drop-down menu using...
27
by: GloStix | last post by:
WARNING VIDEO TAKES A WHILE TO LOAD http://screencast.com/t/BWQ6DNtsM I really don't know how to fix this other than putting another div. But I dont' exactly want to do that for every page....
4
by: Sigilaea | last post by:
My previous post got squashed because m post is too long. Sorry for that: I have an AJAX page with a CSS menu at the top. My problem is the hover functionality stops working after someone clicks...
2
by: DragonMaster | last post by:
Hi all, I am using IE6, and have a problem with css (nearly) only flyout menus. In firefox, it works fine, but in IE6 with the csshover.htc behaviour, I am finding that the 2nd level menu items...
2
by: neovantage | last post by:
Hey all, I have integrated UL, Li base dropdown menu but it is bevaing abnormal in IE. Can somebody have a look on my code and help me out to fix the problem. Here is the Link of my website. ...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.