漂亮的thinkphp 跳转页封装示例


Posted in PHP onOctober 16, 2019

项目是要一点点按优先级进行优化的,现在到优化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 跳转页封装示例

以上这篇漂亮的thinkphp 跳转页封装示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
提升PHP执行速度全攻略(下)
Oct 09 PHP
php str_pad 函数用法简介
Jul 11 PHP
探讨PHP删除文件夹的三种方法
Jun 09 PHP
保存到桌面、设为桌面且带图标的PHP代码
Nov 19 PHP
PHP生成二维码的两个方法和实例
Jul 01 PHP
PHP实现获取图片颜色值的方法
Jul 11 PHP
PHP中如何判断exec函数执行成功?
Aug 04 PHP
thinkphp项目如何自定义微信分享描述内容
Feb 20 PHP
Laravel框架实现超简单的分页效果示例
Feb 08 PHP
php中的buffer缓冲区用法分析
May 31 PHP
Thinkphp5框架ajax接口实现方法分析
Aug 28 PHP
浅析PHP中的 inet_pton 网络函数
Dec 16 PHP
Thinkphp页面跳转设置跳转等待时间的操作
Oct 16 #PHP
解决thinkphp5未定义变量会抛出异常,页面错误,请稍后再试的问题
Oct 16 #PHP
thinkphp5使html5实现动态跳转的例子
Oct 16 #PHP
Thinkphp5 如何隐藏入口文件index.php(URL重写)
Oct 16 #PHP
在thinkphp5.0路径中实现去除index.php的方式
Oct 16 #PHP
laravel5.0在linux下解决.htaccess无效和去除index.php的问题
Oct 16 #PHP
laravel实现上传图片,并且制作缩略图,按照日期存放的代码
Oct 16 #PHP
You might like
无刷新动态加载数据 滚动条加载适合评论等页面
2013/10/16 PHP
腾讯微博提示missing parameter errorcode 102 错误的解决方法
2014/12/22 PHP
CentOS下搭建PHP环境与WordPress博客程序的全流程总结
2016/05/07 PHP
thinkphp框架page类与bootstrap分页(美化)
2017/06/25 PHP
浅谈Laravel中的一个后期静态绑定
2017/08/11 PHP
Javascript 变量作用域 两个可能会被忽略的小特性
2010/03/23 Javascript
通过javascript的匿名函数来分析几段简单有趣的代码
2010/06/29 Javascript
使用jQuery轻松实现Ajax的实例代码
2010/08/16 Javascript
ExtJS如何设置与获取radio控件的选取状态
2014/01/22 Javascript
javascript数组去重方法终极总结
2014/06/05 Javascript
Jquery仿IGoogle实现可拖动窗口示例代码
2014/08/22 Javascript
JavaScript生成SQL查询表单的方法
2015/08/13 Javascript
jQuery 3 中的新增功能汇总介绍
2016/06/12 Javascript
JavaScript中日常收集常见的10种错误(推荐)
2017/01/08 Javascript
关于Bootstrap按钮组件消除黄框的方法
2017/05/19 Javascript
JSON创建键值对(key是中文或者数字)方式详解
2017/08/24 Javascript
vue如何解决循环引用组件报错的问题
2018/09/22 Javascript
Vue 2.0 中依赖注入 provide/inject组合实战
2019/06/20 Javascript
js判断在哪个浏览器打开项目的方法
2020/01/21 Javascript
[01:25]2015国际邀请赛最佳短片奖——斧王《拆塔英雄:天赋异禀》
2015/09/22 DOTA
python计算N天之后日期的方法
2015/03/31 Python
python 读写txt文件 json文件的实现方法
2016/10/22 Python
django加载本地html的方法
2018/05/27 Python
Python中xml和json格式相互转换操作示例
2018/12/05 Python
浅谈python requests 的put, post 请求参数的问题
2019/01/02 Python
python模块常用用法实例详解
2019/10/17 Python
python机器学习实现决策树
2019/11/11 Python
python写文件时覆盖原来的实例方法
2020/07/22 Python
css3实现图片遮罩效果鼠标hover以后出现文字
2013/11/05 HTML / CSS
HTML5混合开发二维码扫描以及调用本地摄像头
2017/12/27 HTML / CSS
巴基斯坦购物网站:Goto
2019/03/11 全球购物
TobyDeals美国:在电子产品上获得最好的优惠和折扣
2019/08/11 全球购物
俄罗斯在线水暖商店:Perfecto.ru
2019/10/25 全球购物
优秀的教师个人的中文求职信
2013/09/21 职场文书
圣诞节红领巾广播稿
2014/02/03 职场文书
设立有限责任公司出资协议书
2014/11/01 职场文书