Question

是否有任何技术允许您在窗口大小调整时更改列表的结构？

这是我的默认标记，显示默认分辨率（980px）上的4个项目：

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

但我希望将其更改为只有两个小于768px的分辨率。标记应动态更改为：

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

我试图通过jquery unwrap和wrap函数来完成它，但它不起作用，因为基础和轨道已经初始化了。

我有什么想法可以做到这一点？

Answer 1

你使用的是.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>

基础4和轨道定制

1 个答案: