기초 4 및 궤도 사용자 지정

창 크기 조정시 목록 구조를 변경할 수있는 방법이 있습니까?기초 4 및 궤도 사용자 지정

이 기본 해상도 (980 픽셀)에 4 개 항목을 보여줍니다 내 기본 마크 업입니다 :

<ul data-orbit data-options="bullets:false; container_class:'rafting-cont'">  
    <li> 
    <div>…</div> 
    <div>…</div> 
    <div>…</div> 
    <div>…</div> 
    </li> 
</ul>

을하지만 768px보다 작은 해상도에 두를 가지고 그것을 변경하고 싶습니다. 기초와 궤도가 이미 초기화 된 이후, 나는 JQuery와 포장을 벗긴 및 랩 기능을 통해 그것을 위해 노력했다

<ul data-orbit data-options="bullets:false; container_class:'rafting-cont'"> 
    <li> 
    <div>…</div> 
    <div>…</div> 
    </li> 
    <li> 
    <div>…</div> 
    <div>…</div> 
    </li> 
</ul>

,하지만 작동하지 않습니다 마크 업 동적으로 변경해야합니다.

어떻게 할 수 있습니까?

출처

2013-05-07 bigcat

여기에서 성취하려는 것은 무엇입니까? 궤도를 두 궤도로 나눈다는 뜻입니까? 또는 작은 화면에서 일부 슬라이드를 숨기시겠습니까? 정렬되지 않은 목록을 두 개로 나누는 것은 의미가 없습니다. –

아니, 나는 그들을 나누고 싶지 않아. 작은 화면에 4 개의 요소 대신 2 개의 요소를 표시하려고합니다. 죄송합니다. 질문이 당신을 혼란스럽게 만들었습니다. 큰 화면에는 4 개의 요소가 표시됩니다. next/prev가 트리거되면 다른 4 그룹이 표시됩니다. 더 작은 스크린에서 나는 2 x 2의 그룹을 가지므로 슬라이더는 회전 목마처럼 행동 할 것입니다. – bigcat

.hide-for-small 및 .show-for-small 클래스를 사용하고 있습니까?

<ul> 

    <li> 
     <div> item 1 </div> 
     <div> item 2 </div> 
     <div class="hide-for-small"> item 3 </div> 
     <div class="hide-for-small"> item 4 </div> 
    </li><!-- end slide-1-a--> 

    <li class="show-for-small"> 
     <div> item 3 </div> 
     <div> item 4 </div> 
    </li><!-- end slide-1-b--> 

</ul>

출처

2013-06-23 21:24:54

기초 4 및 궤도 사용자 지정

답변

관련 문제