Within a list element (a div
) styled with inline-block
, there is a ul
positioned relatively that is initially hidden. To make the div absolute, I added a class but encountered issues specifically in IE8/9 where clicking on the list does not reveal it as expected.
I searched for solutions by googling "ie absolute positioned element disappears" but none of them worked for me.
You can conduct tests on this issue by visiting:
To test, you can save the page (Ctrl+S) and edit the script accordingly.
The positioning conversion process starts at line 956 in jAutochecklist.js file. The element to be moved is referred to as wrapper
.
if (data.settings.absolutePosition){
var offset = wrapper.offset();
var dummy = $('<div></div>').attr('class', pluginName + '_dummy ' + pluginName + '_wrapper').width(wrapper.width()).height(wrapper.height());
obj.after(dummy);
//move the list so the absolute position can become effective
wrapper.addClass(pluginName + '_absolute').appendTo('body').css({
top: offset.top + 3,
left: offset.left
});
elements.input.focus();
}
In addition, when closing the popup while the list is still open/focused in IE, the list remains visible on the screen.
For a visual demonstration, check out this fiddle: http://jsbin.com/anokod/1/edit