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>