gsap+svg实现拖影动画效果代码

代码语言:html

所属分类:动画

代码描述:gsap+svg实现拖影动画效果代码

代码标签: gsap svg 拖影 动画

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

<!DOCTYPE html>

<html lang="en">

<head>

   
<meta charset="UTF-8">





   
<style>
        body
{
         
background-color: #1e1d1f;
         
overflow: hidden;
         
text-align:center;
         
display: flex;
         
align-items: center;
         
justify-content: center;
       
}
       
        body
,
        html
{
         
height: 100%;
         
width: 100%;
         
margin: 0;
         
padding: 0;
       
}
       
        svg
{
         
width: 100%;
         
height: 100%;
         
visibility: hidden;
         
       
}
   
</style>



</head>

<body>
   
<svg id="mainSVG" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<defs>
       
<circle class="dot" cx="0" cy="0" r="4" />

  <g id="spiral"  fill="none" stroke="#000" stroke-miterlimit="10"&.........完整代码请登录后点击上方下载按钮下载查看

网友评论0