CSS3 Loading with Window (Chrome)

dabblet.css

/**
 * CSS3 Loading with Window (Chrome)
 */

body {
  background-color: #111;
}

 .container {
  margin: 100px auto;
  width: 30px;
}

.loader {
  outline: 3px solid #222;
  height: 20px;
  width: 20px;
  border: 4px solid #aaa;
  border-radius: 20px;
  transform: rotate(45deg);
  -webkit-animation: spin 1s infinite;
}

@-webkit-keyframes spin {
  0% {
    border-top-color: #eee;
  }
  25% {
    border-right-color: #eee;
  }
  50% {
    border-bottom-color: #eee;
  }
  75% {
    border-left-color: #eee;
  }
}

dabblet.html

<div class="container" id="container">
	<div class="loader"></div>
</div>

dabblet.js

var container = document.getElementById('container');

container.style.marginTop = (window.innerHeight + container.offsetHeight) / 3 + 'px';

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"result"}