Carousel Property Issue



  • Any idea why in the example removing fullscreen makes everything disappear? I’ve been tearing my hair out trying to understand this. I don’t see any jsfiddles or other stack questions regarding this. It says the fullscreen property is option, but is it just a typo?

    Any examples would be helpful!

    https://onsen.io/v2/api/js/ons-carousel.html


  • Onsen UI

    @Woody-Deck fullscreen applies width and height 100% to the carousel. If it is not full screen, then you must provide the size you want manually:

    ons-carousel {
      height: 100px;
    }
    

    You can also let the carousel grow depending on their items, but it can look weird if the items have different sizes:

      ons-carousel, ons-carousel-item {
        display: table;
        overflow: overlay;
      }
      .page__content {
        overflow-x: hidden;
      }
    


  • Thank you!

    I was confused by the inline styles, and was expecting an attribute to define some of the CSS like it did for fullscreen.


Log in to reply