SHARE
TWEET

Pace with image preloader

a guest Sep 14th, 2016 216 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. body > :not(.pace),body:before,body:after {
  2.     -webkit-transition:opacity .4s ease-in-out;
  3.     -moz-transition:opacity .4s ease-in-out;
  4.     -o-transition:opacity .4s ease-in-out;
  5.     -ms-transition:opacity .4s ease-in-out;
  6.     transition:opacity .4s ease-in-out
  7. }
  8.  
  9. body:not(.pace-done) > :not(.pace),body:not(.pace-done):before,body:not(.pace-done):after {
  10.     opacity:0
  11. }
  12. .pace {
  13.     -webkit-pointer-events: none;
  14.     pointer-events: none;
  15.  
  16.     -webkit-user-select: none;
  17.     -moz-user-select: none;
  18.     user-select: none;
  19.  
  20.     z-index: 2000;
  21.     position: fixed;
  22.     height: 90px;
  23.     width: 90px;
  24.     margin: auto;
  25.     top: 0;
  26.     left: 0;
  27.     right: 0;
  28.     bottom: 0;
  29. }
  30.  
  31. .pace.pace-inactive .pace-activity {
  32.     display: none;
  33. }
  34.  
  35. .pace .pace-activity {
  36.     position: fixed;
  37.     z-index: 2000;
  38.     display: block;
  39.     position: absolute;
  40.     left: 0;
  41.     top: -15px;
  42.     height: 64px;
  43.     width: 64px;
  44.     display: block;
  45.     background: url('../images/loader.gif') no-repeat;
  46. }
RAW Paste Data
Top