I want a floating toolbar in a container. I succeed nicely, (I add the toolbar as item, set floating to true and use the alignTo function) but I have one problem. When the container is not visible (for instance if it is a tab in a tabpanel with another active tab), the toolbar remains visible, It shines through, so to speak.

I would think it needs a floatparent, but according to documentation the floatparent must be a floating container. The container of the toolbar is not floating.

Does anybody have any idea? Below is my definition of the floating toolbar.

Cheers,
Caius

Code:
    //floatin toolbar, to be used in container (just add as item).
    //the toolbar is only visible during mouseover
    Ext.define('Ext.ux.floating.Toolbar', {
        extend: 'Ext.toolbar.Toolbar',
        alias: "widget.floatingtoolbar",
        constructor: function (config) {
            config = config || {};
            config.cls = (config.cls || '') + ' floatingtoolbar';
            config.floating = true,
            config.shadow = false;
            if (!config.location) { config.location = "tr-tr?" }
            this.callParent(arguments);
        },
        tieToOwner: function () {
            this.myOwner.mon(this.myOwner, 'resize', function () { this.alignTo(this.myOwner, this.location) },this);
            this.myOwner.mon(this.myOwner, 'move', function () { this.alignTo(this.myOwner, this.location) }, this);
            this.myOwner.mon(this.myOwner, 'destroy', function () { this.hide(); this.destroy() }, this);
            this.show();
            this.ownerCt = this.myOwner;
            Ext.defer(function () {
                this.alignTo(this.myOwner, this.location);
                if (this.addedHidden) { this.hide() }
            }, 1, this);
        },
        onAdded: function () {
            this.callParent(arguments);
            this.myOwner = this.ownerCt;
            this.addedHidden = this.rendered ? this.hidden : this.initialConfig.hidden;
            if (this.myOwner.rendered) {
                this.tieToOwner()
            } else {
                this.myOwner.mon(this.myOwner, "afterrender", this.tieToOwner, this, { single: true })
            };
        },
        onRemoved: function () {
            this.callParent(arguments);
            this.hide();
            this.destroy();
        }
    });