Показване и скриване на панел при натискане на бутон

въведете описание на изображението тук

Както се вижда на изображението, имам бутон „Скриване“. При щракване върху бутона Скриване искам левият панел да бъде скрит, а десният панел да покрива 100% от екрана. Когато направите това, бутонът "скриване" ще се промени, за да покаже къде панелът се връща в първоначалната си позиция.

За да направиш същото

xtype:'toolbar',
            docked:'top',
            items:[
                {
                    cls:'hide',
                    xtype:'button',
                    text:"Hide",
                    iconMask:true,
                    ui:'back',
                    id:'hide',
                    handler:function () {

                        var viewWidth = Ext.Viewport.getWindowWidth();
                        alert(viewWidth);
                        desiredWidth = Math.min(viewWidth, 400) - 10;
                        Ext.fly('protocol').setStyle('width', desiredWidth); ;

                    }
                },

Опитах горния код, за да променя динамично ширината на панела, но Ext.fly изглежда не работи. Какво може да е решението на това?

Всяка помощ се оценява.


person Khush    schedule 26.04.2012    source източник


Отговори (2)


Акцент в левия панел ще бъде оценен.

Въпреки това, само като гледам изображението ви, правя предположение тук. Ако всичко, което искате да скриете, е левият панел, съдържащ следното

Моето предположение какво представлява левият панел

Тогава може би това, което можете да направите, е да направите превключване на jQuery, след като декларирате ЛЯВИЯ и ДЕСНИя панел в рамките на "DIV" html таг например. Вижте връзката по-долу.

jQuery API за превключване

Освен това, ако използвате библиотека или инструмент на Javascript, за да създадете това, тогава може да искате да получите източника на Javascript и да се потопите в него.

От моя опит е много по-лесно да напишете Javascript функция сами, отколкото да използвате нещо готово.

person Zac    schedule 26.04.2012
comment
Като започнем с, да, прав си. Това е панелът, който искам да скрия. Използвам Sencha touch 2, за да създам това и javascript, използван в sencha, е различен от останалите. Не съм сигурен как мога да обединя кода на jquery в javascript Sencha, за да скрия панела. - person Khush; 26.04.2012

Ext.getCmp('workItemPanel').hide();

работи добре за мен.

person Khush    schedule 26.04.2012