js实现彩带飘舞背景动画效果代码

代码语言:html

所属分类:背景

代码描述:js实现彩带飘舞背景动画效果代码

代码标签: 飘舞 背景 动画 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title></title>
</head>
<body>

    <script  type="text/javascript" size="90" alpha="0.2" zIndex="0">

        (function (name, factory) {
            if (typeof window === "object") {
                window[name] = factory();
            }

        })("Ribbons", function () {
            var _w = window,
            _b = document.body,
            //返回html dom中的body节点 即<body>
            _d = document.documentElement; //返回html dom中的root 节点 即<html>

            // random helper
            var random = function () {
                if (arguments.length === 1) // only 1 argument
                {
                    if (Array.isArray(arguments[0])) // extract index from array
                    {
                        var index = Math.round(random(0, arguments[0].length - 1));
                        return arguments[0][index];
                    }
                    return random(0, arguments[0]); // assume numeric
                } else
                    if (arguments.length === 2) // two arguments range
                {
                    return Math.random() * (arguments[1] - arguments[0]) + arguments[0];
                }
                return 0; // default
            };

            // screen helper
            var screenInfo = function (e) {
                var width = Math.max(0, _w.innerWidth || _d.clientWidth || _b.clientWidth || 0),
                height = Math.max(0, _w.innerHeight || _d.clientHeight || _b.clientHeight || 0),
                scrollx = Math.max(0, _w.pageXOffset || _d.scrollLeft || _b.scrollLeft || 0) - (_d.clientLeft || 0),
                scrolly = Math.max(0, _w.pageYOffset || _d.scrollTop || _b.scrollTop || 0) - (_d.clientTop || 0);

                return {
                    width: width,
                    height: height,
                    ratio: width / height,
                    centerx: width / 2,
                    centery: height / 2,
                    scrollx: scrollx,
                    scrolly: scrolly
                };

            };

            // mouse/input helper
            var mouseInfo = function (e) {
                var screen = screenInfo(e),
                mousex = e ? Math.max(0, e.pageX || e.clientX || 0): 0,
                mousey = e ? Math.max(0, e.pageY || e.clientY || 0): 0;

                return {
                    mousex: mousex,
                    mousey: mousey,
                    centerx: mousex - screen.width / 2,
                    centery: mousey - screen.height / 2
                };

            };

            // point object
            var Point = function (x, y) {
                this.x = 0;
                this.y = 0.........完整代码请登录后点击上方下载按钮下载查看

网友评论0