bfwscroll.js滑动滚动加载动画js插件


bfwscroll.js 滑动滚动加载动画js插件

第一步引入bfwone

第二步执行插件代码

在需要加载的元素class中加入动画类

示例如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["bfwscroll", "bfw|bfw-ani"]);
        });
    </script>
</head>
<body>
    <div class="  bfw-align-c bfw-color-w "
        style="height:1000px;">

        <h1 class="bfw-ani-s-fadeinT bfw-pad-90">HELLO BFWSCROLL</h1>
        <div class="bfw-row-owner bfw-mar-90 ">
            <div class="bfw-row-2 bfw-ani-s-fadeinL">
                <div class="bfw-row-owner bfw-pad-l bfw-over-h">
                    <div class="bfw-row-5">
                        <img src="//repo.bfw.wiki/bfwrepo/image/demo.jpg" />
                    </div>

                </div>
            </div>
            <div class="bfw-row-2 bfw-ani-s-fadeinL">
                <div class="bfw-row-owner bfw-pad-l bfw-over-h">
                    <div class="bfw-row-5">
                        <img src="//repo.bfw.wiki/bfwrepo/image/demo.jpg" />
                    </div>

                </div>
            </div>
            <div class="bfw-row-2  bfw-ani-s-fadeinR">
                <div class="bfw-row-owner  bfw-pad-l bfw-over-h">
                    <div class="bfw-row-5 ">
                        <img src="//repo.bfw.wiki/bfwrepo/image/demo.jpg" />
                    </div>

                </div>
            </div>
            <div class="bfw-row-2 bfw-ani-s-fadeinR">
                <div class="bfw-row-owner bfw-pad-l bfw-over-h">
                    <div class="bfw-row-5 ">
                        <img src="//repo.bfw.wiki/bfwrepo/image/demo.jpg" />
                    </div>

                </div>
            </div>
        </div>


    </div>

    <h1 class="bfw-pad-90 bfw-ani-s-flipinY">YOU GOT IT</h1>
</body>
</html>


立即下载bfwscroll.js查看所有js插件

网友评论0

程序员在线工具箱