按鈕正在加載/顯示圖像，同時按下按鈕sencha touch2

Question

我有一個按鈕，我想顯示給用戶在頁面加載正常按鈕圖標，一旦他按下按鈕，我需要顯示他按下按鈕圖標。我已經通過設置按鈕來達到這個效果。我正在使用sass樣式，從服務器訪問圖像url路徑。它按照我的要求正常工作。 但第一次加載頁面時顯示正常按鈕圖標很好，一旦我按下按鈕需要一些時間意味着（5-10秒）接下來它顯示按下按鈕圖標，這只是第一次發生。爲什麼它第一次加載這麼多時間來加載更改圖標？下一次它會正常工作，在按下按鈕期間立即更改圖標。可以有任何其他最好的方式來實現這一個？

這裏是我的代碼：

{ 
         xtype: "button",       
         cls: 'aboutclsT', 
         handler: function() { 

         } 

        } 

在我app.scss

.aboutclsT{ 
background: url('http://src.sencha.io/100/http://s11.postimage.org/dg1zv08j7/about.png') !important; 
background-repeat: no-repeat; 
height: 133px; 
width: 100px; 

} 

.aboutclsT.x-button-pressing{ 
background: url('http://src.sencha.io/100/http://s7.postimage.org/4vy4hg72z/about_active.png') !important; 
background-repeat: no-repeat; 
height: 133px; 
width: 100px; 
} 

Answer 1

從URL，第一個電話下載它加載按鈕圖像。之後，瀏覽器將其緩存，因此需要時間。 如果你在CSS中使用base64，它將始終是快速的。