Actually I think I figured this out myself, basically it isn’t designed to do this. The carousel element is a “swiper” , which apparently means it only swipes. The animation attribute doesn’t seem to care about fade/lift/etc. just “none” to turn it off. If it’s on, it swipes using the translate3d() function

You can however still control the manner of swiping via the animation-options

Hi - trying to use the ons-carousel to “dissolve” one image into another, rather than having it scroll by. I’ve tried setting the animation to fade and lift but they seem to be the same as slide? (there is no “dissolve” animation option). Setting the animation attribute “none” turns off the slide effect, but I can’t seem to get it to do anything else. I’ve got the timing set to ‘easin-in’ in the animation options, but I think that’s a way of fine tuning the effect once you have the base animation selected.

Any help is greatly appreciated.

<div style=“text-align: center;”>
<ons-row>
<ons-col>
<br />
<ons-carousel id=“carousel” animation=“fade” animation-options="{duration: 1.0, delay: 0, timing: ‘ease-in’}">
<ons-carousel-item>
<img src="…/img/drawing_slide_2.jpg" />
</ons-carousel-item>
<ons-carousel-item>
<img src="…/img/drawing_slide_3.jpg" />
</ons-carousel-item>
<ons-carousel-item>
<img src="…/img/drawing_slide_4.jpg" />
</ons-carousel-item>
<ons-carousel-item>
<img src="…/img/drawing_slide_5.jpg" />
</ons-carousel-item>
</ons-carousel>
</ons-col>
</ons-row>
</div>