Javascript 如何在可滚动容器上使用wow.js_Javascript_Jquery_Wow.js

Javascript 如何在可滚动容器上使用wow.js

javascript jquery

Javascript 如何在可滚动容器上使用wow.js,javascript,jquery,wow.js,Javascript,Jquery,Wow.js,我想在我的网站上使用wow.js。我得到了一个侧边栏，它需要将内容放在一个容器中，并带有overflow-x:auto。因此，wow.js不起作用可以在wow.js中定义滚动容器吗我的站点如下所示： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script src="//cod

我想在我的网站上使用wow.js。我得到了一个侧边栏，它需要将内容放在一个容器中，并带有

overflow-x:auto。因此，wow.js不起作用
可以在wow.js中定义滚动容器吗
我的站点如下所示：
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="lib/js/wow.js"></script>
    <link rel="stylesheet" type="text/css" href="lib/css/animate.css">
    <script>
        $("document").ready(function() {
            new WOW().init();
        })
    </script>
    <style>
        body,html {
            margin: 0;
            padding: 0;
            height: 100%;
            width: 100%;
        }
        #container {
            height: 100%;
            width: 100%;
            position: relative;
        }
        #menu {
            position: absolute;
            width: 300px;
            left: -300px;
            background: red;
        }
        #content {
            position: absolute;
            width: 100%;
            height: 100%;
            background: green;
            overflow-x: auto;
        }
        .wow {
            background: yellow;
        }
    </style>
</head>
<body>
    <div id="container">
        <nav id="menu">
            <ul>
                <li>sidebar1</li>
                <li>sidebar2</li>
                <li>sidebar3</li>
            </ul>
        </nav>
        <div id="content">
            contentcontent<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><div class="wow bounce">text</div>content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
        </div>
    </div>
</body>
<script>
</script>
</html>


$（“文档”）.ready（函数（）{
新的WOW（）.init（）；
})
正文，html{
保证金：0；
填充：0；
身高：100%；
宽度：100%；
}
#容器{
身高：100%；
宽度：100%；
位置：相对位置；
}
#菜单{
位置：绝对位置；
宽度：300px；
左：-300px；
背景：红色；
}
#内容{
位置：绝对位置；
宽度：100%；
身高：100%；
背景：绿色；
溢出-x：自动；
}
.哇{
背景：黄色；
}

侧边栏1
侧边栏2
侧边栏3


<<<
<<<<

<<<
















问题已解决：
我已将Contentcontainer更改为一个节，并使用此代码初始化wow.js
var wow = new WOW({ scrollContainer: "section"});
wow.init();

无论如何谢谢你