Wikiki / bulma-carousel

Display a carousel
MIT License
136 stars 99 forks source link

All images/videos are displayed #92

Closed christianmtr closed 5 years ago

christianmtr commented 5 years ago

All images im my carousel are displayed at left and right of the active image.

I have this code to show it:

...
<section class="section">
    <div class="container">
        <div id="post_images" class="carousel">
            <div class="item-1">
                <figure class="image is-16by9 has-ratio">
                    <img src="path/to/image"/>
                </figure>
            </div>
            <div class="item-2">
                <figure class="image is-16by9 has-ratio">
                    <img src="path/to/image"/>
                </figure>
            </div>
            <div class="item-3">
                <figure class="image is-16by9 has-ratio">
                    <img src="path/to/image"/>
                </figure>
            </div>
        </div>
    </div>
</section>
...
<script>
   bulmaCarousel.attach('#post_images', {
      slidesToScroll: 1,
      slidesToShow: 1,
      loop: true,
    });
</script>
...

Codepen example The active image are "centered" correctly, but the three images are displayed. Is it incorrect? What can I do to fix it?

bykof commented 5 years ago

Adding the css

.carousel {
  overflow: hidden;
}

should do the trick. Nevertheless this is a bug, I think...

christianmtr commented 5 years ago

@bykof it works! Thank you! And sorry for open this issue :roll_eyes: