Skip to content

Instantly share code, notes, and snippets.

@roundrobin

roundrobin/_.md

Last active December 21, 2015 15:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save roundrobin/6330668 to your computer and use it in GitHub Desktop.
Save roundrobin/6330668 to your computer and use it in GitHub Desktop.
Download ZIP
CSS animation
Raw
_.md
Raw
config.json
{"description":"CSS animation ","endpoint":"","display":"div","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.html":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/4vfSzAH.png","ajax-caching":true}
Raw
test.css
#text{
position: absolute;
left:200px;
top:200px;
-webkit-transform: rotate(30deg);
-webkit-animation: slidein 5s; /* Safari and Chrome */
}
@-webkit-keyframes slidein /* Safari and Chrome */
{
0% {background: red;}
100% {background: coral;}
}
Raw
test.html
<html>
<head>
<title>Hello</title>
</head>
<body>
<div id="text">Hallo wie geht es dir</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment