漂亮的thinkphp 跳转页封装示例
程序员文章站
2022-06-29 13:33:59
项目是要一点点按优先级进行优化的,现在到优化thinkphp的跳转页了。
项目是要一点点按优先级进行优化的,现在到优化thinkphp的跳转页了。
<?php if(c('layout_on')) { echo '{__nolayout__}'; } ?> <!doctype html> <html> <head> <meta charset="utf-8"> <title>跳转中</title> <style> .buffer{ background-color: black; height: 100%; width: 60%; margin: auto; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.85; border-radius: 7px; } .buffer_tip{ color: wheat; font-size: 30px; display: block; padding-top: 10px; text-align: center; } .spinner { margin: 16px auto 57px; width: 32px; height: 32px; position: relative; } .cube1, .cube2 { background-color: #67cf22; width: 30px; height: 30px; position: absolute; top: 0; left: 0; -webkit-animation: cubemove 1.8s infinite ease-in-out; animation: cubemove 1.8s infinite ease-in-out; } .cube2 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } @-webkit-keyframes cubemove { 25% { -webkit-transform: translatex(42px) rotate(-90deg) scale(0.5) } 50% { -webkit-transform: translatex(42px) translatey(42px) rotate(-180deg) } 75% { -webkit-transform: translatex(0px) translatey(42px) rotate(-270deg) scale(0.5) } 100% { -webkit-transform: rotate(-360deg) } } @keyframes cubemove { 25% { transform: translatex(42px) rotate(-90deg) scale(0.5); -webkit-transform: translatex(42px) rotate(-90deg) scale(0.5); } 50% { transform: translatex(42px) translatey(42px) rotate(-179deg); -webkit-transform: translatex(42px) translatey(42px) rotate(-179deg); } 50.1% { transform: translatex(42px) translatey(42px) rotate(-180deg); -webkit-transform: translatex(42px) translatey(42px) rotate(-180deg); } 75% { transform: translatex(0px) translatey(42px) rotate(-270deg) scale(0.5); -webkit-transform: translatex(0px) translatey(42px) rotate(-270deg) scale(0.5); } 100% { transform: rotate(-360deg); -webkit-transform: rotate(-360deg); } } #href{ color: wheat; font-size: 20px; } a:link{ text-decoration:none; } </style> </head> <body> <div class='buffer' id='buffer' > <span class='buffer_tip' id='buffer_tip' > <php> if(isset($message)) { echo $message; }else{ if(!empty($error)) { echo $error; }else{ echo '操作出现错误'; } } </php> <a id="href" href="<?php echo($jumpurl); ?>" rel="external nofollow" >(<b id="wait"><?php echo($waitsecond); ?></b>s)</a> </span> <div class="spinner"> <div class="cube1"></div> <div class="cube2"></div> </div> </div> <script type="text/javascript"> (function(){ var wait = document.getelementbyid('wait'),href = document.getelementbyid('href').href; var interval = setinterval(function(){ var time = --wait.innerhtml; if(time <= 0) { location.href = href; clearinterval(interval); }; }, 1000); })(); </script> </body> </html>
效果如下:
以上这篇漂亮的thinkphp 跳转页封装示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。