漂亮的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 相关文章推荐
从一个不错的留言本弄的mysql数据库操作类
Sep 02 PHP
php 获取当前访问的url文件名的方法小结
Feb 08 PHP
PHP中for与foreach的区别分析
Mar 09 PHP
php中将时间差转换为字符串提示的实现代码
Aug 08 PHP
php读取txt文件组成SQL并插入数据库的代码(原创自Zjmainstay)
Jul 31 PHP
Memcached常用命令以及使用说明详解
Jun 27 PHP
smarty模板中使用get、post、request、cookies、session变量的方法
Apr 24 PHP
Zend Framework教程之连接数据库并执行增删查的方法(附demo源码下载)
Mar 21 PHP
php注册审核重点解析(数据访问)
May 23 PHP
Laravel 将数据表的数据导出,并生成seeds种子文件的方法
Oct 09 PHP
Laravel 不同生产环境服务器的判断实践
Oct 15 PHP
TP5框架实现一次选择多张图片并预览的方法示例
Apr 04 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
一个自定义位数的php多用户计数器代码
2007/03/11 PHP
PHP 抓取网页图片并且另存为的实现代码
2010/03/24 PHP
PHP使用GIFEncoder类生成的GIF动态图片验证码
2014/07/01 PHP
PHP实现简单实用的分页类代码
2016/04/08 PHP
教你在header中隐藏php的版本信息
2016/08/10 PHP
PHPStudy下如何为Apache安装SSL证书的方法步骤
2019/01/23 PHP
Array.prototype 的泛型应用分析
2010/04/30 Javascript
jQuery lazyload 的重复加载错误以及修复方法
2010/11/19 Javascript
一个JS的日期格式化算法示例
2013/07/31 Javascript
js 事件截取enter按键页面提交事件示例代码
2014/03/04 Javascript
使用Browserify配合jQuery进行编程的超级指南
2015/07/28 Javascript
借助FileReader实现将文件编码为Base64后通过AJAX上传
2015/12/24 Javascript
基于JavaScript实现抽奖系统
2018/01/16 Javascript
浅谈Node.js 子进程与应用场景
2018/01/24 Javascript
VUE在for循环里面根据内容值动态的加入class值的方法
2018/08/12 Javascript
JS如何获取地址栏的参数实例讲解
2018/10/06 Javascript
vue-cli3项目展示本地Markdown文件的方法
2019/06/07 Javascript
微信小程序分包加载代码实现方法详解
2019/09/23 Javascript
微信小程序背景音乐开发详解
2019/12/12 Javascript
详解tensorflow实现迁移学习实例
2018/02/10 Python
python+pandas分析nginx日志的实例
2018/04/28 Python
python 解压、复制、删除 文件的实例代码
2020/02/26 Python
有影响力的人、名人和艺术家的官方商品:Represent
2019/11/26 全球购物
Sunglass Hut巴西网上商店:男女太阳镜
2020/10/04 全球购物
大学生求职信范文应怎么写
2014/01/01 职场文书
信息技术专业大学生职业生涯规划书
2014/01/24 职场文书
岗位职责风险防控
2014/02/18 职场文书
高中生职业生涯规划书
2014/02/24 职场文书
新年晚会主持词
2014/03/24 职场文书
文秘应届生求职信
2014/07/05 职场文书
用人单位终止解除劳动合同证明书
2014/10/06 职场文书
2015关爱留守儿童工作总结
2014/12/12 职场文书
2016年秋季运动会广播稿
2015/12/21 职场文书
Nginx设置HTTPS的方法步骤 443证书配置方法
2022/03/21 Servers
python3 字符串str和bytes相互转换
2022/03/23 Python
SpringBoot项目部署到阿里云服务器的实现步骤
2022/06/28 Java/Android