1- <!DOCTYPE html> < html lang ="en "class ="loading "> < head > < meta charset ="UTF-8 "> < meta http-equiv ="X-UA-Compatible "content ="IE=edge "> < link rel ="shortcut icon "type ="image/x-icon "href ="/favicon.ico "> < meta name ="viewport "content ="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no "> < title > Loading...</ title > < script > window . config = $config </ script > < script > var ua = window . navigator . userAgent ; if ( ua . indexOf ( "MSIE" ) > - 1 || ua . match ( / T r i d e n t \/ 7 \. / ) ) { var head = document . getElementsByTagName ( "head" ) [ 0 ] , script = document . createElement ( "script" ) ; script . type = "text/javascript" , script . src = "promise.js" , head . appendChild ( script ) } </ script > < style > .error , .loading , .transition {height : 100% }.error body , .loading body , .transition body {height : 100% }# loader {text-align : center;position : fixed;z-index : 3 ;left : 0 ;top : 0 ;height : 100% ;width : 100% ;opacity : 0 ;visibility : hidden;-webkit-transition : all.3s ease;transition : all.3s ease;background-color : rgba (255 , 255 , 255 , .95 )}.loading # loader {opacity : 1 ;visibility : visible}.loading # loader div {display : inline-block;width : 50px ;height : 50px ;vertical-align : middle;-webkit-border-radius : 3px ;border-radius : 3px ;background-color : # fff-webkit-box-shadow : 0 0 3px rgba (0 , 0 , 0 , .15 );box-shadow : 0 0 3px rgba (0 , 0 , 0 , .15 )}.loading # loader div : before {content : '' ;width : 26px ;height : 26px ;display : block;margin : 8px auto0 ;-webkit-border-radius : 20px ;border-radius : 20px ;-webkit-animation : loading.5s linear forwards infinite;animation : loading.5s linear forwards infinite;border-top : 4px solid# 0089faborder-right : 4px solid# ff002bborder-bottom : 4px solid# ffa900border-left : 4px solid# 00a753loading # loader : after {content : '' ;display : inline-block;height : 100% ;vertical-align : middle}@keyframes loading{100% {transform : rotate (360deg )}}@-webkit-keyframes loading{100% {-webkit-transform : rotate (360deg )}}</ style > </ head > < body > < div class ="page home "> < div id ="user "> </ div > < div id ="posts "> </ div > </ div > < div class ="page single "> < div id ="post "> </ div > < div id ="comments "> </ div > </ div > < div id ="loader "> < div > </ div > </ div > < script type ="text/javascript "src ="build.a36e563c.js "> </ script > </ body > </ html >
1+ <!DOCTYPE html> < html lang ="en "class ="loading "> < head > < meta charset ="UTF-8 "> < meta http-equiv ="X-UA-Compatible "content ="IE=edge "> < link rel ="shortcut icon "type ="image/x-icon "href ="/favicon.ico "> < meta name ="viewport "content ="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no "> < title > Loading...</ title > < script > window . config = $config </ script > < script > var ua = window . navigator . userAgent ; if ( ua . indexOf ( "MSIE" ) > - 1 || ua . match ( / T r i d e n t \/ 7 \. / ) ) { var head = document . getElementsByTagName ( "head" ) [ 0 ] , script = document . createElement ( "script" ) ; script . type = "text/javascript" , script . src = "promise.js" , head . appendChild ( script ) } </ script > < style > .error , .loading , .transition {height : 100% }.error body , .loading body , .transition body {height : 100% }# loader {text-align : center;position : fixed;z-index : 3 ;left : 0 ;top : 0 ;height : 100% ;width : 100% ;opacity : 0 ;visibility : hidden;-webkit-transition : all.3s ease;transition : all.3s ease;background-color : rgba (255 , 255 , 255 , .95 )}.loading # loader {opacity : 1 ;visibility : visible}.loading # loader div {display : inline-block;width : 50px ;height : 50px ;vertical-align : middle;-webkit-border-radius : 3px ;border-radius : 3px ;background-color : # fff-webkit-box-shadow : 0 0 3px rgba (0 , 0 , 0 , .15 );box-shadow : 0 0 3px rgba (0 , 0 , 0 , .15 )}.loading # loader div : before {content : '' ;width : 26px ;height : 26px ;display : block;margin : 8px auto0 ;-webkit-border-radius : 20px ;border-radius : 20px ;-webkit-animation : loading.5s linear forwards infinite;animation : loading.5s linear forwards infinite;border-top : 4px solid# 0089faborder-right : 4px solid# ff002bborder-bottom : 4px solid# ffa900border-left : 4px solid# 00a753loading # loader : after {content : '' ;display : inline-block;height : 100% ;vertical-align : middle}@keyframes loading{100% {transform : rotate (360deg )}}@-webkit-keyframes loading{100% {-webkit-transform : rotate (360deg )}}</ style > </ head > < body > < div class ="page home "> < div id ="user "> </ div > < div id ="posts "> </ div > </ div > < div class ="page single "> < div id ="post "> </ div > < div id ="comments "> </ div > </ div > < div id ="loader "> < div > </ div > </ div > < script type ="text/javascript "src ="build.a0a61a10.js "> </ script > </ body > </ html >