jquery - 产品轮播

Question

我想一次显示我的 3 个产品，当您按下上一个/下一个时，它会滑动并显示下一个/上一个 3 个产品。

我的代码:

                <ul class="upsellList">
                 <li><a href="#">prev</a></li>
//1st view       <li class="product_item product_promotion">Product 1</li>
//1st view       <li class="product_item product_promotion">Product 2</li>
//1st view       <li class="product_item product_promotion">Product 3</li>
//2nd view       <li class="product_item product_promotion">Product 4</li> 
//2nd view       <li class="product_item product_promotion">Product 5</li> 
//2nd view       <li class="product_item product_promotion">Product 6</li>
                 <li><a href="#">next</a></li> 
                </ul>

我的 HTML 是根据数据库中的产品数量动态生成的，因此不必担心上一个/下一个按钮。

Answer 1

尝试设置 <ul>宽度加 3 <li>项，然后将其添加到 <ul> CSS overflow:hidden

或

尝试添加 <li>宽度 % .

例如)

 <ul width="100%">
 <li width="33%"></li>
 <li width="33%"></li>
 <li width="33%"></li>
 </ul>