Добавление пользовательского значка для кнопки типа ввода в jQuery mobile 1.4.0

В моем мобильном приложении jQuery у меня есть кнопка, и я добавил для нее собственный значок, проблема в том, что когда я открываю страницу, содержащую эту кнопку, кнопка отображается сначала без значка, затем через 1 секунду значок добавляется, это проблема появляется только на мобильных устройствах. Пожалуйста, как я могу решить эту проблему?

любая помощь будет принята с благодарностью..

<div data-role="page" id="index">
<div data-role="header" data-theme="b">Main</div>
<div data-role="content"> 

<div  class="ui-btn ui-input-btn  ui-icon-User-Icon UsersBTN" >
<input type="button"  id="Users"  data-inline="true"  value="Users"   data-icon="User-  Icon" data-iconpos="left"/>
</div>


</div>
</div>

CSS

.UsersBTN{
   background-color:transparent !important;
   border:none;
}

.UsersBTN.ui-btn .ui-input-btn{
   border: solid grey 3px;
   background:blue;
   color:white !important;
}

.UsersBTN.ui-btn .ui-input-btn.ui-btn-active {
   border: solid white 3px !important;
   background-color:blue; 

}

.ui-icon-User-Icon:after {
   background-image: url(images/user.png);
   background-repeat: no-repeat;
   background-size: 100% 100%;
   background-position: 0% 50%;
   border-radius:0 !important;
   width:38px;
   height:38px;
   margin-top:-18px;
   background-color:transparent;

}

0 ответов

Другие вопросы по тегам