button is taking time to load/show Image while pressing button

[Rameshlamani]

i have a button, i want to show to user in page load normal button icon, once he pressing button i need to show him pressing button icon. i have achieved this one by setting cls for button. i am using sass styles, accessing image url path from the server. it is working fine as per my requirement. but during first time load the page it is shows normal button icon its fine, once i pressing the button it takes some time means(5-10seconds) next it shows pressing button icon, this is happening for first time only. why it is taking first time load this much time for to load change pressing icon? next time it will work fine change the icon immediately during pressing button.Can have any another best way to achieve this one?
Here is my code:
{ xtype: "button", cls: 'aboutclsT', handler: function () { } }

In my 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; }

[estesbubba]

You are loading the button image from an URL and the first call downloads it. After that the browser has it cached and why it's faster. If you base64 it in CSS it will be fast all the time.