Quasar: [V1] [Feature Request] auto adjust carousel height to inner component

Created on 31 Mar 2019  路  3Comments  路  Source: quasarframework/quasar

The current carousel usually crop images of a certain height. It would be good to have a prop that enables the carousel to auto adjust its height based on the image (or content) height.
I come from using vuetify and I am slowly transitioning my website to quasar. On Vuetify, I used the v-window to achieve the desired result. I use it to show different images with text to the users and having them cropped make understanding the images difficult.

Most helpful comment

A new component QResponsive and lots of improvements on QCarousel will be available in the next release v1.9.0.

All 3 comments

I need this, too. Besides, I think that the ratio control for QCarouselSlide (like QImg) would be a good idea.

You can view uncropped images by adding a variation of this css class to each slide

.uncropped-image {
  background-size: contain;  /* don't crop the image  */
  background-repeat: no-repeat;  /* only show the image one time  */
  background-color: grey;  /* color to fill empty space with  */
}

A new component QResponsive and lots of improvements on QCarousel will be available in the next release v1.9.0.

Was this page helpful?
0 / 5 - 0 ratings