lundi 20 avril 2015

Wow.js on elements with background images on Safari display incorrectly

I am using Wow.js on my site and it works fine on all browsers (even IE...) except Safari (running on windows). I am using Bootstrap 3.

I see the following error in the console:

MutationObserver is not supported by your browser.
wow.min.js:2WOW.js cannot detect dom mutations, please call .sync() after loading new content.

There is some mention of this issue here but it is in the context of loading content via AJAX which I am not doing.

Here's my markup:

<style>
    section#background-img{
        background: url("img.jpg");
        background-size: cover;
        background-attachment: fixed;
    }
</style>


<section id="background-img">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 wow fadeInUp" data-wow-duration="800ms">
                <h2>What I can do for you</h2>
                <h3>And how I can help your business grow</h3>
            </div>
        </div>
        <div class="row wow fadeInUp" data-wow-duration="800ms">
            <div class="col-sm-4">
                <!-- content removed for brevity-->
            </div>
        </div>
    </div>
</section>

It should look like this: enter image description here

But instead I see this: enter image description here

I use Wow.js elsewhere on this page which works fine. The problem seems to arise when I use background images.

Aucun commentaire:

Enregistrer un commentaire