jquerymobile : 버튼의 왼쪽, 오른쪽 아이콘을 모두 표시하는 방법

Question

jquerymobile의 버튼에 대해 왼쪽, 오른쪽 모두 data-icon을 표시하려면 어떻게해야합니까? 미리 감사드립니다.

감사합니다, jQuerymobile 문서에서 nehatha

Answer 1

, 당신은 하나 개의 영역에 아이콘의 위치를 ​​고정 할 수 있습니다. 둘 다 표시하려면 (왼쪽과 오른쪽), 사용자 정의 된 CSS와 JS가 필요합니다.

data-iconpos="left" 

data-iconpos="right" 

data-iconpos="top" 

data-iconpos="bottom" 

Answer 2

헤더 부분이 시도 :

<div data-role="header"> 
    <a href="" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a> 
    <h1>Add Contacts</h1> 
    <a href="" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a> 
</div> 

Answer 3

이 버튼을 내부 그리드를 만든 다음 왼쪽 열에서 이미지를 추가 한 후 CSS 스타일이 같은

<a data-role="button" data-transition="slide" data-theme="b" href="#" 
     data-icon="arrow-r" data-iconpos="right"> 
    <div class="ui-grid-b"> 
     <div class="ui-block-a"> 
      <img src="image.png" class="iconleft"/> 
     </div> 
     <div class="ui-block-b"> 
      Button 
     </div> 
     <div class="ui-block-c"> 
     </div> 
    </div> 
</a> 

을보고

CSS :

.iconleft { 
    position: absolute; 
    top: 50%; 
    margin-top: -9px; 
    left: -5px; 
    width: 18px; 
    height: 18px; 
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.4); 
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.4); 
    box-shadow: 0 1px 0 rgba(255,255,255,.4); 
    background-color: #666; 
    background-color: rgba(0,0,0,.4); 
    background-image: url(images/icons-18-white.png); 
    background-repeat: no-repeat; 
    -webkit-border-radius: 9px; 
    border-radius: 9px; 
} 

당신은 항상 다른 방향으로 할 수 있습니다. 왼쪽은 데이터 아이콘이고 오른쪽은 이미지이지만 실제로는 중요하지 않습니다.

내가이`데이터 iconpos`for 같은 버튼을 사용할 수 있습니다, here 또는 this fiddle