Carousal-折叠div中的自动高度（GlideJS）

Question

I am using GlideJS to display a carousal. The height of each item in this carousal is different and I have therefore set the property:

autoheight: true

The problem is when I try to display the carousal in a collapsed div with the autoheight property set to 'true' the carousal is not displayed. When the autoheight property is set to false the carousal does display but then the height of the items is fixed. To illustrate this problem I have created the following Fiddle:

https://jsfiddle.net/7dma7L84/21/

How can I display the carousal in a collapsed div with auto height for each item?

Answer 1

I play a little with this and seems to solve problem with this:

#Carousel {
    width: 500px;
    height: auto;
}
var carousel = $('#Carousel').glide({
    type: 'carousel',
    startAt: 1,
    touchDistance: 2,
    autoplay: 0,
    autoheight: true
});

What do you think?

Answer 2

Check this picture and please confirm me if I understand correctly your desired