0

我在这里使用 JQuery Carousel 插件：http ://www.thomaslanciaux.pro/jquery/jquery_carousel.htm

我已经这样设置了：

<script type="text/javascript">
    $(function(){
        $(".carousel").carousel();
    });
</script>

<div id="carouselholder">
<div class="carousel">
    <ul>
        <li><img src="images/1.jpg" alt=""></li>
        <li><img src="images/2.jpg" alt=""></li>
        <li><img src="images/3.jpg" alt=""></li>
    </ul>
</div>
</div><!--CAROUSELHOLDER-->

但是当我点击 Next 按钮时，它似乎转移了整个ul而不是li.

有谁知道如何解决这一问题？（或者也许有更好的插件？）

下图：Element Inspector 的屏幕截图：

在此处输入图像描述

4

3 回答 3

1

这个插件的文档似乎有点薄。似乎需要一些额外的样式才能使其工作，但没有一个示例说明这一点。

您的设置是正确的，实际上它会移动整个 UL 分组，只显示当前选择的 li。使用上面的简单代码，我所做的只是添加以下 CSS 以使其工作：

li {
  float: left;
}

只需为您的容器添加更多样式以约束视图，您应该一切顺利。

于 2012-12-17T00:20:18.123 回答
0

我认为这就是它的工作方式

如果你在 carousel-wrap 上设置一个宽度，所以它只显示一个图像，ul 移动位置以显示下一个

li 标签不动

如果你想尝试另一个插件，我推荐这个 http://caroufredsel.dev7studios.com/index.php。

于 2012-12-17T00:11:25.283 回答
0

感谢大家的帮助，但我发现 Cycle 插件的修改版本效果更好：

http://jquery.malsup.com/cycle/nowrap.html

于 2012-12-17T00:39:10.497 回答