Skip to content

Instantly share code, notes, and snippets.

@hanfeisun

hanfeisun/dabblet.css

Last active September 9, 2015 09:38
Show Gist options
  • Save hanfeisun/c48d1a3f4274e347557c to your computer and use it in GitHub Desktop.
Save hanfeisun/c48d1a3f4274e347557c to your computer and use it in GitHub Desktop.
Download ZIP
Untitled
Raw
dabblet.css
div.circle {
height: 134px;
width: 134px;
background-color: #000;
margin: 50vh auto 0;
transform: translateY(-50%);
border-radius: 50%;
animation-name: expand;
animation-duration: 2s;
animation-timing-function: ease-in;
animation-direction: alternate;
animation-iteration-count: infinite;
overflow: hidden;
}
div.hint {
position: absolute;
top: 80%;
left: 50%;
transform: translateX(-50%);
font-size: 35px;
font-family: "Hiragino Kaku Gothic StdN";
text-align: center;
}
@keyframes expand {
from {height:134px; width: 134px;}
to {height:1000px; width:1000px;}
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="circle"></div>
<div class="hint">触摸画面正中的形状</div>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment