Question

我正在进行网页开发，我做了一个从右到左移动的滑块和单个＆lt; Li>但我想用水平线和垂直线创建两个行滑块。

你们有没有人帮我开发。

enter image description here

如下图所示，我想创建

Answer 1

我找到了一个新的jquery插件。你可以尝试这个插件

http://jsabdul.wordpress.com/2013/01/17/multiple-rows-carousel/

Answer 2

我不清楚“具有水平线和垂直线的两排滑块”究竟是什么意思。基于图片，我可以想到2个解决方案：

您使用普通列表，但每个列表包含两个项目：

 <ul id="slider">
      <li>
       <span class="row">
        <span class="row_item"><a href="#"><img src="topimage1.jpg"></a></span>
        <span class="row_item"><a href="#"><img src="topimage4.jpg"></a></span>
       </span> 
     </li>
      <li>
       <span class="row">
        <span class="row_item"><a href="#"><img src="topimage2.jpg"></a></span>
        <span class="row_item"><a href="#"><img src="topimage5.jpg"></a></span>
       </span> 
      </li>
      <li>
       <span class="row">
        <span class="row_item"><a href="#"><img src="topimage3.jpg"></a></span>
        <span class="row_item"><a href="#"><img src="topimage6.jpg"></a></span>
       </span> 
      </li>
    </ul>

.row, .row_item{display:block;}

您使用两个不同的列表，两个控制器都由同一组箭头组成：

      <ul id="top_slider">
          <li></li>
      </ul>
      <ul id="bottom_slider">
          <li></li>
      </ul>

 And an example of jquery (I assume you're using some slider plugin with a `moveFOrward()` 
 callback, or similar. If you developed your own, adjust accordingly. ):

 $('#arrow_left').click(function(e){
    $('#top_slider').moveForward();
    $('#bottom_slider').moveForward();
    e.preventDefault();
 });

两行滑块，水平线和垂直线？

2 个答案: