TweenMax实现老照片影像动画效果闪动效果代码

代码语言:html

所属分类:动画

代码描述:TweenMax实现老照片影像动画效果闪动效果代码

代码标签: 影像 动画 效果 闪动 效果

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

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">


    <style>
        body,html {
            width: 100%;
            height: 100%;
            padding: 0px;
            margin: 0px;
        }
        body {
            background-color: #000;
            overflow: hidden;
        }
        body:before {
            opacity: 0.2;
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            box-shadow: inset 0px 0px 250px 30px black;

        }
        #container {
            overflow: hidden;
            position: absolute;
            transform: translate(-50%,-50%);
            left: 50%;
            top: 50%;
            width: 500px;
            height: 280px;
            box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
            filter: sepia(30%);
            border: solid 6px #222;
        }
        #container:after {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            box-shadow: inset 0px 0px 150px 20px black;
            mix-blend-mode: multiply;
        }
        #pic {
            opacity: 0.7;
        }
        .pic {
            position: absolute;
        }

        .line {
            position: absolute;
            height: 100%;
            width: 1px;
            opacity: 0.1;
            background-col.........完整代码请登录后点击上方下载按钮下载查看

网友评论0