3. RTL right to left Carousel

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

RTL right to left Carousel

  • A

    Hii
    I am trying to change the direction of the swiping for carousel and still having issues.
    I tried to change the css into rtl direction but it seems this not enough. there is another change to make on the code js file.
    Can you direct me through this?
    The carousel should start from the right, and swiping it left will make it swipe left.

    thanks

    0
  • E
    administrators

    The carousel already swipes left and right if you have swipeable set.

    All you need to is set the initial starting item to the last one by setting the initial-index to the number of items you have minus 1. So if you have 3 items in your carousel set it to 2:

    <ons-carousel initial-index="2" swipeable></ons-carousel>
    0
  • A

    @emccorson said in RTL right to left Carousel:

    initial-index=“2”

    Yes, this make the slider swipe from right to left.
    but the first image is placed on the left and the other sliders are hidden behind it. I couldn’t fix that with css.

    0
  • E
    administrators

    That’s probably more bother than it’s worth to try and fix. I would suggest just adding your items in reverse order e.g.

    <ons-carousel>
  <ons-carousel-item>third</ons-carousel-item>
  <ons-carousel-item>second</ons-carousel-item>
  <ons-carousel-item>first</ons-carousel-item>
</ons-carousel>
    0