JCarousel jQuery插件

Question

我使用JCarousel jQuery插件控制图像列表，但无法正常工作。 我能做什么？

http://jsfiddle.net/mk1z6p3x/中有一个演示

 $(function () { $('.jcarousel').jcarousel(); }); 

 .jcarousel { position: relative; overflow: hidden; } .jcarousel ul { width: 20000em; position: relative; list-style: none; margin: 0; padding: 0; } .jcarousel li { float: left; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://raw.githubusercontent.com/jsor/jcarousel/master/dist/jquery.jcarousel.min.js"></script> <div class="jcarousel"> <ul dir="rtl"> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img1.jpg');"></li> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img2.jpg');"></li> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img3.jpg');"></li> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img4.jpg');"></li> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img5.jpg');"></li> <li style="background: url('http://sorgalla.com/jcarousel/examples/_shared/img/img6.jpg');"></li> </ul> </div> 

编辑：我告诉他们@redelschaap时更改了它们，我在css .jcarousel li添加了新样式，但此插件仍然无法使用。 看到这里： jsfiddle.net/mk1z6p3x/1

Answer 1

您将这些图像用作背景图像，并将列表项留空。 您看不到它们，因为它们没有宽度/高度。 给您的项目指定（最小）宽度和高度，或将图像用作列表项目中的<img>标签。

编辑：您还忘记了包含jcarousel.basic.js文件，并且由于某种原因而无法加载jquery.jcarousel.min.js 。 我已经更新了您的小提琴： http : //jsfiddle.net/mk1z6p3x/2/ 。 检查外部资源菜单。