[Solved] QCarousel full screen in v0.15.6

  • Hi, I just migrated from 0.14.9 to V0.15.6 today and found many breaking change to solve.
    One that I cannot find a simple solution is how QCarousel toggle full screen is now behave.
    In version 0.14.9, just put fullscreen option to q-carousel and there’ll be a button on bottom right corner of carousel. In 0.15.6, there’s a lot of code just to put full-screen botton there.
    The end result has strange looking carousel in both small and full-screen.
    Here’s fiddle that I created to illustrate the issue I ran into.
    In short, using src-img make image overflow the carousel.
    It constraint only height of picture, so in full screen, left and right side of picture got chop off.

    I tried with different config. Here’s another fiddle.
    I use html <img> tag instead of using src-img.
    It look a bit better than getting a chop off image but the background is very distracting as it doesn’t dim background like in 0.14

    Can anybody suggest me how to simulate q-gallery-carousel behavior with 0.15 ?

  • To whom who face similar issue like me…
    Here’s how I simulate previous QGalleryCarousel.


    Disclaimer: I don’t know if it should be done like this. I just want customer to work with my app as it was.

  • Admin

    Better use img-src prop on QCarouselSlide. Forked previous jsfiddle: https://jsfiddle.net/h4yc1j37/6/

  • @rstoenescu
    But it will truncate image.
    I need image to be scaled to fit viewer and maintain it aspect ratio.

Log in to reply

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.