title: Preloader fade out and content fade in
body: <p>I'm sure this is easy fix. I need that my preloader fade out slowly. I tried with css animation but didn't work. Can somebody tell me how should i do that in javascript ? As you can see in example, the transition is very rough. I don't want that.</p>
  
  <pre><code>&lt;script&gt; &lt;!--Preloader--&gt;
  var myVar;
  
  function preloader() {
      myVar = setTimeout(showPage, 1500);
  }
  
  function showPage() {
    document.getElementById("preloader").style.display = "none";
    document.getElementById("wrapper").style.display = "block";
  }
  &lt;/script&gt;
  </code></pre>
  
  <p><a href="http://codepen.io/anon/pen/mEWaPX" rel="nofollow">CODEPEN EXAMPLE</a></p>