svg+spirit实现射箭动画效果代码
代码语言:html
所属分类:动画
代码描述:svg+spirit实现射箭动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body {
background: #F9E3B1;
}
svg {
display: block;
width: auto;
height: 90vh;
margin: 0 auto;
}
</style>
</head>
<body >
<svg viewBox="0 0 1836 1514">
<rect style="fill:#F9E3B1;" width="1836" height="1514" />
<line style="fill:none;stroke:#282828;stroke-width:22;stroke-linecap:round;stroke-miterlimit:10;" x1="902.094" y1="974.078" x2="933.592" y2="1143.565" />
<path id="arm-left" style="fill:none;stroke:#282828;stroke-width:23;stroke-linecap:round;stroke-miterlimit:10;" d="
M992.089,821.086c0,0,133.493,29.998,275.986-133.493" />
<path style="fill:#37B1BC;" d="M557.41,695.625c-1.437,15.111-2.457,24.666-3.079,35.684c-0.622,32.637-0.846,10.553-0.689,33.12
c0.156,6.937,0.693,19.95,1.591,30.634c0.898,5.791,2.159,28.592,3.763,28.227c1.604,4.874,3.552,18.05,5.825,25.898
c2.273,32.227,4.872,23.587,7.778,23.649c2.906,27.982,6.119,24.54.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0