0

我需要能够在我的 Carousel 上方有一个选项卡菜单，单击该选项卡菜单会将 carousel 移动到 carousel 内的相关包中。

此外，当旋转木马被刷卡时，选项卡将根据您刷卡到的包裹移动。因此，如果您滑动，则活动选项卡将发生变化，反之亦然。

我已经整理了一个演示，除了链接选项卡和轮播之外，所有这些都可以工作。我完全不知道如何做到这一点。

我的演示代码和示例： - http://jsfiddle.net/jnYs7/

<ul id="navlist">
   <li>BASIC</li>
   <li class="activeStep">STANDARD</li>
   <li>SUPER</li>
   <li>ANTOHER</li>
</ul>

插件正在使用： http ://www.mobify.com/mobifyjs/modules/carousel-examples/

希望有人能帮忙。谢谢

4

1 回答 1

0

一个例子：http: //jsfiddle.net/jnYs7/3/

我所做的是移动#navlist内部并在其中添加.m-carousel属性，使其成为分页。我还将您的班级名称更改为.<a>data-slide='number_here'<a>activeStepm-active

现在您只需要对其进行样式设置。

更新http://jsfiddle.net/jnYs7/10/

更改margin-right此处以定义 div 之间的距离

.m-center:not(.m-fluid) > .m-carousel-inner > *:not(:first-child),
.m-center:not(.m-fluid) > .m-carousel-inner > *:not(:last-child){
    position: relative;
    float: left;
    left:40px;
    margin-left:0px;
    margin-right:-30px;
}

我没有找到对起点的任何引用，但是您可以使用.trigger()来自 jquery 之类的东西来触发链接上的点击事件

$('#navlist li:eq(2) a').trigger('click'); 
//:eq() is the index of li (in this case super)

在更新的小提琴中，我总体上更改了一些 CSS，比较缺少 CSS 的小提琴。

于 2013-05-18T20:29:38.663 回答