Question

我有这个脚本，我想添加一个自动播放模块。这是开始：

$(document).ready(function () {
    var carousel = $("#carousel").waterwheelCarousel({
      flankingItems: 3,
      movingToCenter: function ($item) {
        $('#callback-output').prepend('movingToCenter: ' + $item.attr('id') + '<br/>');
      },
      movedToCenter: function ($item) {
        $('#callback-output').prepend('movedToCenter: ' + $item.attr('id') + '<br/>');
      },
      movingFromCenter: function ($item) {
        $('#callback-output').prepend('movingFromCenter: ' + $item.attr('id') + '<br/>');
      },
      movedFromCenter: function ($item) {
        $('#callback-output').prepend('movedFromCenter: ' + $item.attr('id') + '<br/>');
      },
      clickedCenter: function ($item) {
        $('#callback-output').prepend('clickedCenter: ' + $item.attr('id') + '<br/>');
      }
    });

以下是导航按钮：

    $('#prev').bind('click', function () {
      carousel.prev();
      return false
    });

    $('#next').bind('click', function () {
      carousel.next();
      return false;
    });

    $('#reload').bind('click', function () {
      newOptions = eval("(" + $('#newoptions').val() + ")");
      carousel.reload(newOptions);
      return false;
    });

  });

有人可以帮我这么做吗？

这是我的css代码：

body {
    font-family:Arial;
    font-size:12px;
    background:#ededed;
}
.example-desc {
    margin:3px 0;
    padding:5px;
}

#carousel {
    width:960px;

    height:300px;
    position:relative;
    clear:both;
    overflow:hidden;
}

隐藏图片直到旋转木马可以处理它们，否则点击的项目就不那么明显了：

#carousel img {
    visibility:hidden; 
    cursor:pointer;
}

.split-left {
    width:450px;
    float:left;
}
.split-right {
    width:400px;
    float:left;
    margin-left:10px;
}
#callback-output {
    height:250px;
    overflow:scroll;
}
textarea#newoptions {
    width:430px;
}

Answer 1

阅读the documentation。

将autoPlay: 5000,（其中5000是更改之间的毫秒数）添加到选项中。

如何让我的水车旋转木马自动播放？

1 个答案: