https://github.com/fanqingsong/animation_on_asyncjs

leverage async library to implement animation
https://github.com/fanqingsong/animation_on_asyncjs

async

Last synced: 3 months ago
JSON representation

leverage async library to implement animation

• Host: GitHub
• URL: https://github.com/fanqingsong/animation_on_asyncjs
• Owner: fanqingsong
• Created: 2019-06-16T14:28:25.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2021-07-30T12:10:02.000Z (almost 4 years ago)
• Last Synced: 2025-01-14T13:53:43.540Z (5 months ago)
• Topics: async
• Language: SCSS
• Homepage:
• Size: 2.82 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# async animation

> 页面动画采用async库实现。

效果

 显示从左到右每个一秒highlight一个方块字。

![dynamical color changing block](demo.png)

~~

var async = require("async");

window.onload = () => {

    let salutions = document.querySelectorAll("#salutions>div");

    for(let one of salutions){

        one.style.display = "none";

    }

    async.waterfall([

        function(callback) {

            salutions[0].style.display = "flex";

            setTimeout(callback, 1000);

        },

        function(callback) {

            salutions[1].style.display = "flex";

            setTimeout(callback, 1000);

        },

        function(callback) {

            salutions[2].style.display = "flex";

            setTimeout(callback, 1000);

        },

        function(callback) {

            salutions[3].style.display = "flex";

            setTimeout(callback, 1000);

        },

        function(callback) {

            callback(null);

        }

    ], function (err, result) {

        // result now equals 'done'

    });

};

~~

## base project is from

  webpack多页面脚手架

- 详情可以查看此文章

  - https://bryanadamss.github.io/2018/01/02/webpack-multi-page/