TweenMax+svg铲雪加载进度条动画效果代码

代码语言:html

所属分类:进度条

代码描述:TweenMax+svg铲雪加载进度条动画效果代码

代码标签: TweenMax svg 铲雪 加载 进度条

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <link href="https://fonts.googleapis.com/css?family=Snowburst+One" rel="stylesheet">



    <style>
        body {
          background-color:#8F97A6;
          overflow: hidden;
          text-align:center;
        }
        
        body,
        html {
          height: 100%;
          width: 100%;
          margin: 0;
          padding: 0;
        }
        
        
        svg{
          width:800px;
          height:600px;
          visibility:hidden;
         overflow: visible;
        }
        
        text{
         text-anchor:start;
         font-family:'Snowburst One', cursive;
         fill:#FFF;
         font-size:65px;
        }
    </style>


</head>

<body>
    <svg class="loaderSVG" viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg">
 <defs>
  <filter id="goo">
      <feGaussianBlur in="SourceGraphic" stdDeviation="2" result="blur" />
      <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 21 -9" result=&qu.........完整代码请登录后点击上方下载按钮下载查看

网友评论0