Contents |
Have you ever experienced the select form element z-index issue in Internet Explorer 6? Most likely you have if you've implemented some sort of drop down menu navigation that shows up over a select form element.
The background iframe (bgiframe) plugin provides a very small, quick and easy way to fix that problem so you don't have to worry about it. No matter the size, borders or position the bgiframe plugin can fix it.
The usage is simple. Just call bgiframe on a jQuery collection of elements.
$('.fix-z-index').bgiframe();
The plugin tries its best to handle most situations but sometimes some configuration is necessary. For example if your borders are defined in a unit other than pixels, you will need to manually set the top and left properties to the negative width of the border.
The bgiframe plugin works by prepending an iframe to the element. The iframe is given a class of bgiframe and positioned below all the other children of the element. In the default configuration it automatically adjusts to the width and height of the element (including the borders) and the opacity is set to 0. The element needs to have position (relative or absolute) and should have a background (color or image).
The latest release can be downloaded from the project page.
Or you can live on the edge and just pull from Git: http://github.com/brandonaaron/bgiframe/tree/master
Please report bugs, features, patches or requests for support via the project page.
bgiframe is tested in those browsers that jQuery supports. See browser compatibility for more info.
bgiframe is Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses. Copyright © 2009 Brandon Aaron (http://brandonaaron.net/).