Remove Preloader

preloader.coffee

# Preloader
# 	IE9+, iOS
# --------------------------------------------------------
# cache
# 	preloader — "занавески"
# 	loader — вращающийся элемент
# remove — удаляет прелоадер с анимацией
# --------------------------------------------------------

Preloader = do ->
	init: ->
		do @cache
		do @settings
		do @remove
	cache: ->
		preloader = document.getElementById("preloader")
		loader = document.getElementById("loader")
	settings: ->
		@duration = 400
		@timing = "ease-out"
	remove: ->
		fn = (progress) =>
			loader.style.opacity = 1 - progress
			if progress is 1
				preloader.style.pointerEvents = "none"
				fn2 = (progress) =>
					preloader.style.opacity = 1 - progress
				AnimHandler.init fn2, @duration, @timing
		AnimHandler.init fn, @duration, @timing

preloader.html

<div id="preloader">
	<div id="loader"></div>
</div>

preloader.styl

// PRELOADER
// ==================================
#preloader
	width 100%
	height 100%
	position fixed
	top 0
	left 0
	background black
	z-index 1000
#loader
	width 50px
	height 50px
	border 3px solid transparent
	border-top-color red
	border-bottom-color blue
	border-right-color amber
	border-left-color purple
	border-radius 50%
	position absolute
	top 50%
	left 50%
	margin -25px 0 0 -25px
	animation: loader 1s infinite linear

@keyframes loader {
	from {
		transform rotate(0deg)
	}
	to {
		transform rotate(360deg)
	}
}