2013-11-25 1 views
0

접을 수있는 머리글에 약간의 바닥을 넣는 트릭을 아는 사람이 있습니까?접을 수있는 머리글에 단추를 추가하는 방법

은 이걸로 시도 : http://jsfiddle.net/84g5c/

<div data-role="page" id="page1"> 
    <div data-theme="a" data-role="header"> 
     <h3> 
      Header 
     </h3> 
    </div> 

    <div data-role="content" class="lista"> 

     <div data-role="collapsible-set" data-theme="b" data-content-theme="c" class="collapsible"> 
      <div data-role="collapsible" data-collapsed="false" data-collapsed-icon="arrow-r" data-expanded-icon="arrow-d"> 
       <h3> 
        ¿How to put buttons here?   
        <a href="index.html" data-role="button" data-icon="delete" data-iconpos="notext" data-mini="true">Delete</a>      
        <a href="index.html" data-role="button" data-icon="plus" data-iconpos="notext" data-mini="true">Add</a>          
       </h3> 
       <ul data-role="listview" data-inset="false" id="tarea1" class="tarea"> 
        <li data-theme="c"> 
         <a href="#page1" data-transition="slide"> 
          Button1 
         </a> 
        </li> 
        <li data-theme="c"> 
         <a href="#page1" data-transition="slide"> 
          Button2 
         </a> 
        </li> 
        <li data-theme="c"> 
         <a href="#page1" data-transition="slide"> 
          Button3 
         </a> 
        </li> 
        <li data-theme="c"> 
         <a href="#page1" data-transition="slide"> 
          Button4 
         </a> 
        </li> 
       </ul> 
      </div> 
     </div> 

    </div> 
</div> 

.ui-icon.ui-icon-delete.ui-icon-shadow{ 
    position: absolute !important; 
    left: 0px !important; 
} 

.ui-btn.ui-shadow.ui-btn-corner-all.ui-btn-icon-notext.ui-btn-up-c{ 
    float: right !important; 
} 

감사합니다!

+1

가능한 복제본 [접을 수있는 콘텐츠 헤더 (분할 링크) 내에 링크 추가 - CSS 누락] (http://stackoverflow.com/questions/19331789/add-link-within-collapsible-content-header-split-link) -css-missing) – frequent

+1

@ 빈번한 답변은 jQM 1.4,이 데모 http://jsfiddle.net/Palestinian/84g5c/1/을 jQM 1.3.2 이하에 대해 다룹니다. – Omar

+0

감사합니다. 나는 여기에 약간의 개선을했다 : http://jsfiddle.net/quvBs/ 그것은 나를 위해 일한다. 그러나 여전히 문제가 있습니다 : 접을 수있는 부분이 붕괴되면 버튼의 열이 사라집니다. – webmeiker

답변

0

더 우아함을 알 수있는 스텔스 형 버튼 용 Asnwer. 아이콘 주변의 버튼을 볼 수없는 경우 적응하기가 너무 힘들지 않아야합니다.

http://jsfiddle.net/YaQ29/

<div data-role="collapsible" data-theme="b"> 
    <h2><p class=inline>ggggggggggg</p> 
     <a class="inline coll_head_butt" data-theme="b" onclick="alert('clicked');" data-iconpos="notext" data-role="button" data-icon="check"></a> 
    </h2> 
</div> 

CSS :

.inline{display:inline !important;} 


.coll_head_butt{ 
    margin-left : 50px !important; 
    /*padding:1em !important;*/ 
    border-style:none !important; 
    box-shadow:none !important; 
} 

당신은 필요한 경우 축소 확대에서 버튼을 방지 할 수 있습니다.

+0

날짜를 잘 보았습니다. – IazertyuiopI

관련 문제