jquery+svg实现svg三角正弦余弦实验动画效果代码
代码语言:html
所属分类:动画
代码描述:jquery+svg实现svg三角正弦余弦实验动画效果代码
代码标签: jquery svg 三角 正弦 余弦 实验 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body{
margin:0;
padding:0;
background:#114488;
}
</style>
</head>
<body>
<svg width="640" height="480">
<rect x="100" y="100" width="200" height="200" stroke="#5577aa" fill="transparent"/>
<path d="M200 100 L200 300 M100 200 L300 200" stroke="#5577aa" fill="transparent"/>
<text x="200" y="90" font-family="sans-serif" font-size="15" text-anchor="middle" fill="white">0º</text>
<text x="310" y="205" font-family="sans-serif" font-size="15" fill="white">90º</text>
<text x="200" y="320" font-family="sans-serif" font-size="15" text-anchor="middle" fill="white">180º</text>
<text x="90" y="205" font-family="sans-serif" font-size="15" text-anchor="end" fill="white">360º</text>
<!-- Arc -->
<path d="M200 100" fill="transparent" stroke="white" id="my-arc-01"/>
<!-- Sin -->
<path d="M100 350 L300 350" stroke="#5577aa" fill="transparent"/>
<path d="M200 350" stroke="white" id="line-sin" fill="transparent"/>
<text x="200" y="370" font-family="sans-serif" font-size="15" text-.........完整代码请登录后点击上方下载按钮下载查看
网友评论0