Home > Article > Web Front-end > CSS3+JS sample code sharing to implement character running animation

CSS3+JS sample code sharing to implement character running animation

黄舟Original: 2017-05-28 13:08:541665browse

Rendering:

Code:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5/CSS3奔跑动画DEMO演示 - 何问起</title><base target="_blank" />
<link href="http://hovertree.com/texiao/jquery/58/css.css" rel="stylesheet" type="text/css" />
<script src="http://hovertree.com/texiao/css/8/prefixfree.min.js"></script>
</head>

<body>
<div class=&#39;kai animate&#39; id=&#39;running&#39;>
<div class=&#39;eyes&#39;></div>
</div>
<div class=&#39;slide&#39;>
<div class=&#39;stage&#39;>
<div class=&#39;foreground-trees&#39;></div>
<div class=&#39;landscape&#39;></div>
<div class=&#39;behind-trees&#39;></div>
<div class=&#39;behind-mountains&#39;></div>
</div>
</div>
<div class="infohovertree">生命在于运动，奔跑吧兄弟！
<br />
<a href="http://hovertree.com">首页</a> <a href="http://hovertree.com/texiao/">特效</a> <a href="http://hovertree.com/h/bjaf/5f5eiagg.htm">原文</a>
</div>
<script type="text/javascript" src=&#39;http://down.hovertree.com/jquery/jquery-1.12.3.min.js&#39;></script>
<script type="text/javascript" src=&#39;http://hovertree.com/texiao/jquery/58/js/jquery.transform.js&#39;></script>
<script type="text/javascript" src="http://hovertree.com/texiao/jquery/58/js/index.js"></script>
</body>
</html>

The above is the detailed content of CSS3+JS sample code sharing to implement character running animation. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Sample code sharing using CSS3 to realize floating display of descriptions on mouse-over imagesNext article：Sample code sharing using CSS3 to realize floating display of descriptions on mouse-over images

See more

CSS3+JS sample code sharing to implement character running animation

Related articles