文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在可滚动容器上使用wow.js

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

Stack Overflow用户

提问于 2015-08-28 07:06:35

回答 1查看 2.3K关注 0票数 1

我想在我的网站上使用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>

javascript

jquery

wow.js

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-08-28 07:19:55

解决问题：

我已将内容容器更改为一节，并使用此代码插入wow.js

var wow = new WOW({ scrollContainer: "section"});
wow.init();

不管怎样，谢谢

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32265202

复制

相似问题

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

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在可滚动容器上使用wow.jsEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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