在Extjs中使用setTitle后的窗口标题CSS

Question

我有一个要求，我需要在extjs窗口标题中显示以下代码片段。这是动态的，这意味着我需要在将setTitle（）用于窗口之后显示此代码。请分享您的想法。

body {
  background-color: #47d1da;}
p {
  color: white;
  font: 300 4em/150% Impact;
  text-align: center;}


/* loading dots */

.loading:after {
  content: ' .';
  animation: dots 1s steps(5, end) infinite;}

@keyframes dots {
  0%, 20% {
    color: rgba(0,0,0,0);
    text-shadow:
      .25em 0 0 rgba(0,0,0,0),
      .5em 0 0 rgba(0,0,0,0);}
  40% {
    color: white;
    text-shadow:
      .25em 0 0 rgba(0,0,0,0),
      .5em 0 0 rgba(0,0,0,0);}
  60% {
    text-shadow:
      .25em 0 0 white,
      .5em 0 0 rgba(0,0,0,0);}
  80%, 100% {
    text-shadow:
      .25em 0 0 white,
      .5em 0 0 white;}}

<p class="loading">Login in progress</p>

Answer 1

您可以如下使用set cls

Ext.define('Fiddle.MyWin',{
extend:'Ext.window.Window',
title : 'Initial title',
xtype:'myWin',
width:200,
height:300,
initComponent:function(){
    this.callParent();
    this.setTitle({
        cls : 'testTitle',
        text : 'Changed'
    });
}})

也可以在这里找到工作示例https://fiddle.sencha.com/#view/editor&fiddle/35ns