TweenMax+svg实现相机拍照生成照片动画效果代码
代码语言:html
所属分类:动画
代码描述:TweenMax+svg实现相机拍照生成照片动画效果代码
代码标签: TweenMax svg 相机 拍照 生成 照片 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
background-color:#C2EB87;
overflow: hidden;
}
body,
html {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
svg{
width:100%;
height:100%;
visibility:hidden;
overflow:hidden;
}
</style>
</head>
<body >
<svg class="mainSVG" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<title>3D polaroid</title>
<defs>
<clipPath id="topMask">
<rect class="topMask"x="313.2" y="214.6" fill="#D2FF15" width="172" height="114.6"/>
</clipPath>
<clipPath id="botMask">
<rect class="botMask" x="313.2" y="339" fill="#D2FF15" width="172" height="57"/>
</clipPath>
<clipPath id="photoMask">
<rect x="313.2" y="354" fill="#D2FF15" width="172" height="57"/>
</clipPath>
<rect id="slot" x="333" y="349" width="133" height="21" rx="10.38" ry="10.38" fill="#333"/>
</defs>
<g id="wholeCamera.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0