vivus+svg实现描边显示动画效果代码

代码语言:html

所属分类:动画

代码描述:vivus+svg实现描边显示动画效果代码

代码标签: vivus svg 描边 显示 动画

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

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
body{
background: red;  
}
</style>



</head>

<body>
  <!-- Head: HI THERE -->
		<div class="bloc bloc-head">
			<svg height="300" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
				 viewBox="0 0 404.7 354" enable-background="new 0 0 404.7 354" id="hi-there" onclick="hi.reset().play();">

				<!-- HI -->
				<path fill="none" data-duration="10" stroke="#FFFFFF" stroke-width="4" d="M324.6,61.2c16.6,0,29.5-12.9,29.5-29.5c0-16.6-12.9-29.5-29.5-29.5c-16.6,0-29.5,12.9-29.5,29.5C295.1,48.4,308,61.2,324.6,61.2z"/>
        <path fill="none" data-duration="130" stroke="#FFFFFF" stroke-width="4" d="M366.2,204.2c-9.8,0-15-5.6-15-15.........完整代码请登录后点击上方下载按钮下载查看

网友评论0