0

我想做垂直旋转木马。我正在使用淘汰赛进行绑定,但我无法这样做。当我查看文件时,数据中没有任何内容显示。唯一显示的是下一个上一个按钮。怎么做?

html如下:

<div class="middleLeftDiv">
    <div id="myCarousel" class="carousel slide vertical" data-bind="foreach: AssociationTypes">
        <div class="carousel-inner clickable" data-bind="attr: { id: ObjectAssociationType }" onclick="onSelectAssociation(this)">
            <div class="active item">
                <span class="veticaltextname1" data-bind="text: ObjectAssociationType"/>
            </div>
        </div>
        <!-- Carousel nav -->
        <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹&lt;/a>
        <a class="carousel-control right" href="#myCarousel" data-slide="next">›&lt;/a>
    </div>
</div>

我与 Knockout 绑定的 JS 文件:

 $.ajax({
    type: "POST",
    url: '/member/GetMemberItems',
    data: ko.toJSON({ typeOfMedia: typeOfMedia }),
    contentType: "application/json",
    success: function (response) {
        if (!hasError(response)) {
            self.Association(response);
        }
    }
});
$('.carousel').carousel();

CSS:

.vertical .carousel-inner {
  height: 100%;
}

.carousel.vertical .item {
  -webkit-transition: 0.6s ease-in-out top;
     -moz-transition: 0.6s ease-in-out top;
      -ms-transition: 0.6s ease-in-out top;
       -o-transition: 0.6s ease-in-out top;
          transition: 0.6s ease-in-out top;
}

.carousel.vertical .active {
  top: 0;
}

.carousel.vertical .next {
  top: 100%;
}

.carousel.vertical .prev {
  top: -100%;
}

.carousel.vertical .next.left,
.carousel.vertical .prev.right {
  top: 0;
}

.carousel.vertical .active.left {
  top: -100%;
}

.carousel.vertical .active.right {
  top: 100%;
}

.carousel.vertical .item {
    left: 0;
}
4

1 回答 1

1

这可能对你有帮助。没有响应,但它可以解决您关于垂直旋转的问题

Github

于 2013-08-28T04:51:00.417 回答