漂亮的thinkphp 跳轉(zhuǎn)頁封裝示例

更新時間：2019年10月16日 10:22:51 作者：笨小孩好笨

今天小編就為大家分享一篇漂亮的thinkphp 跳轉(zhuǎn)頁封裝示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

項目是要一點點按優(yōu)先級進行優(yōu)化的，現(xiàn)在到優(yōu)化thinkphp的跳轉(zhuǎn)頁了。

<?php
 if(C('LAYOUT_ON')) {
  echo '{__NOLAYOUT__}';
 }
?>
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>跳轉(zhuǎn)中</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 '操作出現(xiàn)錯誤';
      } 
    }
  </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 跳轉(zhuǎn)頁封裝示例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

PHP圖像處理之使用imagecolorallocate()函數(shù)設置顏色例子
這篇文章主要介紹了PHP圖像處理之使用imagecolorallocate()函數(shù)設置顏色例子,本文給出了十進制和十六進制2種設置顏色的方法,需要的朋友可以參考下
2014-11-11
ThinkPHP路由詳解
ThinkPHP路由通俗的說，他是一個url的傳輸規(guī)則，例如：index.php?g=Home&m=Index&a=price 這個規(guī)則也是可以變化的，& 可以設置為@或者其他，規(guī)則主要有pathinfo等，在設置偽靜態(tài)的時候也用的著他
2015-07-07
php防止sql注入的方法詳解
本文主要介紹了php防止sql注入的方法。具有很好的參考價值，下面跟著小編一起來看下吧
2017-02-02
PHP實現(xiàn)顯示照片exif信息的方法
這篇文章主要介紹了PHP實現(xiàn)顯示照片exif信息的方法,需要的朋友可以參考下
2014-07-07
PHP在引號前面添加反斜杠(PHP去除反斜杠)
PHP在引號前面添加反斜杠的原因及PHP去除反斜杠的辦法，三種辦法關閉php魔術引號
2013-09-09
php7連接MySQL實現(xiàn)簡易查詢程序的方法
這篇文章主要給大家介紹了關于php7連接MySQL實現(xiàn)簡易查詢程序的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-10-10
json的鍵名為數(shù)字時的調(diào)用方式(示例代碼)
json的鍵名為數(shù)字時的調(diào)用方式(示例代碼)。需要的朋友可以過來參考下，希望對大家有所幫助
2013-11-11
PHP通過iconv將字符串從GBK轉(zhuǎn)換為UTF8字符集
PHP通過iconv將字符串從GBK轉(zhuǎn)換為UTF8字符集的方法，需要的朋友可以參考下。
2011-07-07
PHP實現(xiàn)騰訊云視頻加密的示例代碼
上傳到騰訊云上面的視頻，如何實現(xiàn)防盜鏈？本文就為大家提供了php實現(xiàn)騰訊云視頻加密的示例代碼，感興趣的小伙伴快跟隨小編一起學習一下
2022-04-04
PHP訪問MYSQL數(shù)據(jù)庫封裝類(附函數(shù)說明)
MYSQL 數(shù)據(jù)訪問方式，php4支持以mysql_開頭的過程訪問方式，php5開始支持以mysqli_開頭的過程和mysqli面向?qū)ο笤L問方式，本封裝類以mysql_封裝
2010-12-12