How to make custom preloader with Hype-based animation

Hi guys!
Here are a simple trick based at [this post] (Creating a Custom Preloader)

You just need to make a small HTML code modifications.

  1. Insert this code to style section`on page

     	.maxHeight {
     height: 100vh !important;
     width: 100% !important;
  2. And this code after body tag

     <div id="cover_hype_container" class ="maxHeight" >
     <!-- loader via iframe code: -->
      <div class ="maxHeight">
     <iframe src="loader.html" width="100%" height="100%" scrolling="no" frameBorder="0">

Of course, you should close div tags.

Thats all. Works great with full with and hight page
Complete example below: (532.6 KB)