Onsen-ui Carousel属性无法自动播放

问题描述 投票:0回答:1

我在这里使用温泉用户界面,我在移动网络应用中使用轮播,但是在这里出现了一些问题,我无法使用属性自动播放。

   <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)
  });
});

没有错误消息发生,但我的自动播放选项不起作用。

javascript html css onsen-ui
1个回答
0
投票
如果您通过说“自动播放”来表示auto-scroll选项,我想您会误解了auto-scroll选项的目标,并期望轮播会通过其项,而无需用户使用auto-scroll选项进行任何操作。

documentation

© www.soinside.com 2019 - 2024. All rights reserved.