繁体   English   中英

jQuery轮播-转移UL而非LI

[英]JQuery Carousel - shifting UL not LIs

我正在从这里使用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-->

但是,当我按下“下一步”按钮时,似乎会使整个ul而不是li转移。

有谁知道如何解决这一问题? (或者也许有更好的插件?)

下图:Element Inspector的屏幕截图:

在此处输入图片说明

该插件的文档似乎有点苗条。 似乎需要一些其他样式来使其起作用,但是没有一个示例可以说明这一点。

您的设置正确无误,实际上它将移动整个UL分组,仅显示当前选择的li。 使用上面的简单代码,我所做的就是添加以下CSS以使其起作用:

li {
  float: left;
}

只需在容器中添加更多样式即可约束视图,那么您应该一切顺利。

我认为这就是工作的意义

如果您在轮播包装纸上放了一个宽度,那么它只会显示一张图片,ul会移动位置以显示下一张

li标签不动

如果您想尝试其他插件,建议您使用http://caroufredsel.dev7studios.com/index.php

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

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM