View Full Version : [CLOSED][3.0.2] hideMode: "visibility" - needs positioning in IE

Stefan B
15 Mar 2010, 1:46 AM
If you have a panel with hideMode: "visibility" that is initially hidden, it is not laid out and keeps its {left: 0px; top: 0px} position, thus overlapping the actual visible content in this place and rendering mouse sensitive areas unusable.

Test case:

Ext.onReady(function() {

var p = new Ext.Panel({
width: 500,
height: 500,
layout: "hbox",
layoutConfig: {
align: "stretch"
items: [{
width: 150,
tbar: [{
text: "Click me",
handler: function() {
alert("You clicked the left toolbar button.");
}, {
flex: 1,
tbar: [{
text: "You cannot click me",
handler: function() {
alert("How did you do that?");
disabled: true
hidden: true,
hideMode: "visibility"
renderTo: Ext.getBody()


The button in the left (visible) toolbar does not receive mouseover or click events in IE.

Tested in IE7 and IE8 on Windows XP.
Ext version: 3.0.2

Stefan B
15 Mar 2010, 2:33 AM

This also occurs with hideMode: "offsets" and seems to be more of a problem with box layout. If you replace the hbox layout with a border layout, all is fine.

15 Mar 2010, 2:57 AM
Have you tried the beta? http://www.extjs.com/forum/announcement.php?f=41&a=15

The behaviour doesn't present itself.

Stefan B
15 Mar 2010, 3:39 AM
It's already gone in 3.1.2.
High time we upgrade, I guess.