boxy IE6 SELECT element fix

4 views
Skip to first unread message

dsilva

unread,
Sep 26, 2008, 2:22:12 PM9/26/08
to boxy
IE6 <SELECT> element doesn't support z-index, so if you have layer
that covers the drop down, the drop down will still be visible. By
applying the below fix it hides the select elements when you display a
layer that covers the drop down, but makes them visible for the boxy
content. It then makes it visible when the layer is removed or hidden.


// Make this boxy instance visible
show: function() {
if (this.visible) return;
if (this.options.modal) {
jQuery('<div class="boxy-modal-blackout"></div>')
.css({zIndex: Boxy._nextZ(),
width: jQuery(document).width(),
height: jQuery(document).height()})
.appendTo(document.body);
this.toTop();
}
this.boxy.stop().css({opacity: 1, display: 'block'});
this.visible = true;
//hide the select elements for IE6
if (document.all && !window.XMLHttpRequest) {
$("select").css({ visibility:"hidden" });
//we need to make the select elements inside the boxy pop-up
visible
$(".boxy-content select").css({ visibility:"visible" });
}
return this;
},

// Hide this boxy instance
hide: function(after) {
if (!this.visible) return;
var self = this;
if (this.options.modal) {
jQuery('.boxy-modal-blackout').animate({opacity: 0},
function() {
jQuery(this).remove();
});
}
this.boxy.stop().animate({opacity: 0}, 300, function() {
self.boxy.css({display: 'none'});
self.visible = false;
if (after) after(self);
});
//show the select elements for IE6
if (document.all && !window.XMLHttpRequest) {
$("select").css({ visibility:"visible" });
}
return this;
},
Reply all
Reply to author
Forward
0 new messages