Untitled

dabblet.css

.bola {
width:50px;
height:50px;
background-color:red;
border-radius:50%;
trasnform-style: preserve-3d;
perspective:100px;
}
@keyframes anima {
0% {transform: translateX(0%) scale3d(.5,.5,.5);background-color:blue;} 
100% {transform: translateX(100%) rotateY(90deg);background-color:green;};
}
.animaClass {
animation-name: anima; 
animation-duration: 1s; 
animation-iteration-count: infinite; 
animation-direction: alternate; 
animation-timing-function: ease-in-out; 
animation-fill-mode: forwards; 
animation-delay: 2s;
}

dabblet.html

<div class="animaClass bola"></div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}