graingert / WOW

Reveal CSS animation as you scroll down a page
https://wowjs.uk
Other
1.58k stars 1.56k forks source link

In bootstrap 4, size md, elements are not displayed #30

Closed blovia22 closed 4 years ago

blovia22 commented 4 years ago

Hello, I have this:

<div class="container">
    <div class="row">
        <div class="col-lg-6">
            <p>This text displays fine.</p>
        </div>
        <div class="col-lg-6">
            <p>This text also displays fine.</p>
            <p>In the image below, if I remove the wow class, I can see the image.
               If I leave the wow class, the image is not displayed only when the
               size of the window is md, for example, 977px wide.</p>
            <img src="some-image.jpg"
                class="img-fluid center-block wow fadeInRightBig"
                data-wow-delay="0s"
                data-wow-duration="1s"
                data-wow-offset="200"
                alt="Some image" />
        </div>
    </div>
</div>

In the image some-image.jpg, if I remove the wow class, I can see the image.

If I leave the wow class, the image is not displayed only when the size of the window is md, for example, 977px wide.

I tried removing the img-fluid and center-block classes but it still doesn't work.

It works fine in Bootstrap 3, the problem is only with bootstrap 4. I am using the latest version of wow.min.js and animate.css and bootstrap 4. Thanks.

blovia22 commented 4 years ago

I am using a menu called webslidemenu. When I remove this menu, the problem with wow goes away. Thanks.