jCarouselLite - 将列表项强制转换为单行

Question

我在我正在建设的网站上的列表中使用jCarousellite。它工作得很好，但问题是由于某种原因，脚本导致列表项停止堆叠。

我的意思是 - 而不是这个：

li     li
li     li

我得到了这个：

li     li     li      li

当我删除脚本时，它工作正常，但是使用它，它会强制它们全部放在一个“行”上。我查看了脚本，无法弄清楚哪一部分强迫它们全部放在一行上。

以下是脚本：http://www.trekradio.net/dev/wp-content/themes/tr2012/js/jcarousellite_1.0.1.js

您还可以在Heaer的“Whats On”部分看到问题的演示：http://www.trekradio.net/dev/（此网站正在建设中，请原谅其状态）。

编辑：在脚本中将“垂直”选项设置为“true”会将轮播滚动更改为垂直并显示这样的列表项，这不是我想要的：

li

li

li

li

Answer 1

更新：[丑陋的修复]

这是您需要在jcarousellite_1.0.1.js中更新的行（您添加了小/ 2位）：

    var ulSize = liSize * itemLength / 2;                   // size of full ul(total length, not just for the visible items)

请注意，因为它会影响任何其他页面中的所有其他轮播。

更新2：向后兼容的修复

我修补了.js文件，您可以在代码中使用选项lines，或者默认情况下将其保留为1行：

<script type="text/javascript">
$(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        lines : 2
    });
});
</script>

这是the patched jcarousellite_1.0.1.js

祝你好运！

-

我担心这会让jCarouselLite有点过分。

我建议你将li拆分为两个ul，通过PHP或甚至在Javascript / jquery中操作DOM。

这样，您可以通过设置两个并行的水平轮播来实现目标。

希望这有帮助！