我在这里使用温泉用户界面,我在移动网络应用中使用轮播,但是在这里出现了一些问题,我无法使用属性自动播放。
<ons-page>
<ons-toolbar>
<div class="left">
<ons-toolbar-button onclick="prev()">
<ons-icon icon="md-chevron-left"></ons-icon>
</ons-toolbar-button>
</div>
<div class="center">Carousel</div>
<div class="right">
<ons-toolbar-button onclick="next()">
<ons-icon icon="md-chevron-right"></ons-icon>
</ons-toolbar-button>
</div>
</ons-toolbar>
<ons-carousel fullscreen auto-scroll id="carousel">
<ons-carousel-item style="background-color: #085078;">
<div style="text-align: center; font-size: 30px; margin-top:
20px;
color: #fff;">
BLUE
</div>
</ons-carousel-item>
<ons-carousel-item style="background-color: #373B44;">
<div style="text-align: center; font-size: 30px; margin-top: 20px;
color: #fff;">
DARK
</div>
</ons-carousel-item>
<ons-carousel-item style="background-color: #D38312;">
<div style="text-align: center; font-size: 30px; margin-top: 20px;
color: #fff;">
ORANGE
</div>
</ons-carousel-item>
< /ons-carousel>
</ons-page>
和我的Javascript:
var prev = function() {
var carousel = document.getElementById('carousel');
carousel.prev();
};
var next = function() {
var carousel = document.getElementById('carousel');
carousel.next();
};
ons.ready(function() {
var carousel = document.addEventListener('postchange', function(event) {
console.log('Changed to ' + event.activeIndex)
});
});
没有错误消息发生,但我的自动播放选项不起作用。
auto-scroll
选项,我想您会误解了auto-scroll
选项的目标,并期望轮播会通过其项,而无需用户使用auto-scroll
选项进行任何操作。