用于动画的Ext js面板显示无法正常工作

时间:2019-07-04 12:53:24

标签: javascript extjs

Ext JS Modern Theme具有一个面板。点按“隐藏”时此面板将再次显示带有动画的同一面板。现在,面板隐藏有效,但显示无效。有人发现问题吗?

Ext.defer()正在处理警报。仅显示功能不起作用。

{
 xtype  : 'panel',
 layout  : {
    type: 'vbox',
    align: 'center',
         },
 width   : '30%',
 name    : 'countImg',
 html    : '<div  > <img src="./resources/mala.png"></div>', 
 hideAnimation:{
     type        : 'slideOut',
     duration    : 500,
     direction   : 'top',
   },
 showAnimation:{
     type        : 'slideIn',
     duration    : 500,
     direction   : 'down',
   },
 listeners:
 {
   initialize: function()
  {
      this.element.on({
      tap: function()
      { 
       var imgPanelObj = Ext.ComponentQuery.query('panel[name=countImg]');
        imgPanelObj[0].hide();  
        Ext.defer( function(){
           imgPanelObj[0].show();
}, 500);
 }
     });
   }    
 }   
}

我想在隐藏面板后再次显示带有动画的面板。就像上下滑动一样。

1 个答案:

答案 0 :(得分:0)

{ 
   var imgPanelObj = Ext.ComponentQuery.query('panel[name=countImg]');
    imgPanelObj[0].hide();  
    Ext.defer( function(){
       imgPanelObj[0].show();
}, 1000);

增加有效期