animate in

dabblet.css

/* animate in */

@keyframes myfirst
{
from {margin-top: 100px;opacity:0}
to {margin-top: 50px; opacity:1}
}
@keyframes myfirst2
{
from {margin-top: 15px}
to {margin-top: 10px}
}
.text1{
animation: myfirst 1s cubic-bezier(0.3, -1, 0.7, 2.5);
margin-top:50px;



}

@keyframes mysecond
{
from {margin-left: -50px;opacity:0}
to {margin-left: 0; opacity:1}
}
.text2{
animation: mysecond 1s cubic-bezier(0.3, -1, 0.7, 2.5);
margin-top:150px;
}

@keyframes mythird
{
from {margin-top: 100px;opacity:0}
to {margin-top: 0; opacity:1}
}
.text3{
animation: mythird 1s ease-out;
}

dabblet.html

<!--
<div class="text1">
fdsafdsafds
</div>
-->
<div class="text2">
asfddfsafdas
</div>


<div class="text3">
asfdfadsfads
</div>

dabblet.js

// alert('Hello world!');

settings.json

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