Solved

DIV loses focus when HTML select control option is hovered over in IE

Posted on 2011-09-09
3
562 Views
Last Modified: 2012-05-12
I added a HTML select control to a div drop-down menus on a website I am starting to develop. When I hover over an option in the HTML select control the div drop-down menu it is contained in, automatically and immediately loses focus and disappears – so it is impossible to select an option in the HTML select control. This only happens in Internet Explorer. It works perfectly in Firefox and Chrome (i.e. you can hover over options and the drop-down menu div remains focused and visible).

Here is the problematic page…
http://www.funasset.net

HTML select controls appear on the Products and Solutions drop-down menus. Both are problematic.

Note: There are no active links on this web page.

I hope someone can help me please!
0
Comment
Question by:funasset
  • 2
3 Comments
 
LVL 30

Accepted Solution

by:
LZ1 earned 500 total points
ID: 36511334
0
 

Author Closing Comment

by:funasset
ID: 36511813
I tried the example provided and it works perfectly in all browsers - even nasty IE. However, implementing it means hacking my code about and changing the way the entire menu system works (which is currently CSS driven).

I think I might remove the select controls from the drop-down menus, but thanks for your great answer.
0
 
LVL 30

Expert Comment

by:LZ1
ID: 36512113
Sorry I couldn't help you more.  But please dont' try to "hack" your code. If you can't get something, ask us.

I was going to ask you if you had another way to present those options to the user. It's not a "bad" way necessarily, however you may want to think about the overall user-experience when doing something like that.  Not to mention, as you've just seen, the cross-browser nightmares. ;)
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

Suggested Solutions

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
Envision that you are chipping away at another e-business site with a team of pundit developers and designers. Everything seems, by all accounts, to be going easily.
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now