All In One Script



PHP,HTLM,CSS,Jquery,AJAX,Javascript and etc doubts and sample codes

  • Home
  • Javascript
  • PHP
  • CSS
  • SQL/MYSQL

Solve the select Overlap bug in IE6

by Blogger 4:12:00 AM CSS html-select IE6 internet-explorer-6 Overlap

Solve the select Overlap bug in IE6


When using IE, you cannot put an absolutely positioned div over a select input element. That's because the select element is considered an ActiveX object and is on top of every HTML element in the page.
I already saw people hiding selects when opening a popup div, that leads to pretty bad user experience having controls disappearing.
FogBugz actually had a pretty smart solution (before v6) of turning every select into text boxes when a popup was displayed. This solved the bug and tricked the user eye but the behavior was not perfect.
Another solution is in FogBugz 6 where they no more use the select element and recoded it everywhere.
Last solution I currently use is messing up the IE rendering engine and force it to render the absolutely positioned <div> as an ActiveX element too, ensuring it can live over a select element. This is achieved by placing an invisible <iframe> inside the <div> and styling it with:
#MyDiv iframe
{
    position: absolute;
    z-index: -1;
    filter: mask();
    border: 0;
    margin: 0;
    padding: 0;
    top: 0;
    left: 0;
    width: 9999px;
    height: 9999px;
    overflow: hidden;
}
Does anyone have an even better solution than this one?
EDIT: The purpose of this question is as much informative as it is a real question. I find the <iframe>trick to be a good solution, but I am still looking for improvement like removing this ugly useless tag that degrades accessibility.

Answer :


I don't know anything better than an Iframe
But it does occur to me that this could be added in JS by looking for a couple of variables
  1. IE 6
  2. A high Z-Index (you tend to have to set a z-index if you are floating a div over)
  3. A box element
Then a script that looks for these items and just add an iframe layer would be a neat solution
Paul

source:http://stackoverflow.com/questions/7937/solve-the-select-overlap-bug-in-ie6





READ MORE
SHARE :

Search This Blog

Followers

  • Popular
  • Recent
  • Comments
    Serving XHTML and self-closing tags
    How to efficiently iterate over each Entry in a Map?
    Get first key in a (possibly) associative array?
    How to avoid Java code in JSP files?
    Does finally always execute in Java?
    Solved : curl_init() function not working in Ubuntu
    Why does this code using random strings print “hello world”?
    In Java, difference between default, public, protected, and private
    How can I make the cursor a hand when a user hovers over a list item?
    Length of a JavaScript object

Instagram

About

Popular Posts

  • Serving XHTML and self-closing tags
    Serving XHTML and self-closing tags I am trying to follow the xhtml 1.0 strict standard as I am creating my website. Right now, validat...
  • How to efficiently iterate over each Entry in a Map?
    How to efficiently iterate over each Entry in a Map? If I have an object implementing the  Map  interface in Java and I wish to iterate...
  • Get first key in a (possibly) associative array?
    Get first key in a (possibly) associative array? What's the best way to determine the first key in a possibly associative array? My...
  • How to avoid Java code in JSP files?
    How to avoid Java code in JSP files? I'm new to Java EE and I know that something like the following three lines <%= x + 1 %...
  • Does finally always execute in Java?
    Does finally always execute in Java? I have a try/catch block with  return s inside it. Will the finally block be called? For example...
  • Solved : curl_init() function not working in Ubuntu
    Solved : curl_init() function not working in Ubuntu  Here solved the error  Fatal error: Call to undefined function curl_init() ...
  • Why does this code using random strings print “hello world”?
    Why does this code using random strings print “hello world”? The following print statement would print "hello world". Could a...
  • In Java, difference between default, public, protected, and private
    In Java, difference between default, public, protected, and private In Java , are there clear rules on when to use each of access modifi...
  • How can I make the cursor a hand when a user hovers over a list item?
    How can I make the cursor a hand when a user hovers over a list item? I've got a list, and I have a click handler for its items: ...
  • Length of a JavaScript object
    Length of a JavaScript object If I have a JavaScript object, say var myObject = new Object (); myObject [ "firstname" ] ...

statcounter



statcounter



Template Created By ThemeXpose & Blogger Templates