1、效果图

2、上干货

  • 为了增加对移动设备的支持，在  /application/common.php加入以下函数：

     function isMobile()
    
 {
    
     if (isset ($_SERVER['HTTP_X_WAP_PROFILE']))
    
     {
    
         return true;
    
     }
    
     if (isset ($_SERVER['HTTP_VIA']))
    
     {
    
         return stristr($_SERVER['HTTP_VIA'], "wap") ? true : false;
    
     }
    
     if (isset ($_SERVER['HTTP_USER_AGENT']))
    
     {
    
         $clientkeywords = array ('nokia',
    
             'sony',
    
             'ericsson',
    
             'mot',
    
             'samsung',
    
             'htc',
    
             'sgh',
    
             'lg',
    
             'sharp',
    
             'sie-',
    
             'philips',
    
             'panasonic',
    
             'alcatel',
    
             'lenovo',
    
             'iphone',
    
             'ipod',
    
             'blackberry',
    
             'meizu',
    
             'android',
    
             'netfront',
    
             'symbian',
    
             'ucweb',
    
             'windowsce',
    
             'palm',
    
             'operamini',
    
             'operamobi',
    
             'openwave',
    
             'nexusone',
    
             'cldc',
    
             'midp',
    
             'wap',
    
             'mobile'
    
             );
    
         if (preg_match("/(" . implode('|', $clientkeywords) . ")/i", strtolower($_SERVER['HTTP_USER_AGENT'])))
    
         {
    
             return true;
    
         }
    
     }
    
     if (isset ($_SERVER['HTTP_ACCEPT']))
    
     {
    
         if ((strpos($_SERVER['HTTP_ACCEPT'], 'vnd.wap.wml') !== false) && (strpos($_SERVER['HTTP_ACCEPT'], 'text/html') === false || (strpos($_SERVER['HTTP_ACCEPT'], 'vnd.wap.wml') < strpos($_SERVER['HTTP_ACCEPT'], 'text/html'))))
    
         {
    
             return true;
    
         }
    
     }
    
     return false;
    
 }

  • 替换模板(  找到文件 /thinkphp/tpl/dispatch_jump.tpl  ，删除里面的全部代码，加入下面代码)

     {__NOLAYOUT__}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
 <html xmlns="http://www.w3.org/1999/xhtml">
    
 <head>
    
 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
    
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
     <title>跳转提示</title>
    
     <?php if(isMobile()==true){?>
    
     <style type="text/css">
    
         body, h1, h2, p,dl,dd,dt{margin: 0;padding: 0;font: 15px/1.5 微软雅黑,tahoma,arial;}
    
         body{background:#efefef;}
    
         h1, h2, h3, h4, h5, h6 {font-size: 100%;cursor:default;}
    
         ul, ol {list-style: none outside none;}
    
         a {text-decoration: none;color:#447BC4}
    
         a:hover {text-decoration: underline;}
    
         .ip-attack{width:100%; margin:200px auto 0;}
    
         .ip-attack dl{ background:#fff; padding:30px; border-radius:10px;border: 1px solid #CDCDCD;-webkit-box-shadow: 0 0 8px #CDCDCD;-moz-box-shadow: 0 0 8px #cdcdcd;box-shadow: 0 0 8px #CDCDCD;}
    
         .ip-attack dt{text-align:center;}
    
         .ip-attack dd{font-size:16px; color:#333; text-align:center;}
    
         .tips{text-align:center; font-size:14px; line-height:50px; color:#999;}
    
     </style>
    
 <?php }else{ ?>
    
 <style type="text/css">
    
         body, h1, h2, p,dl,dd,dt{margin: 0;padding: 0;font: 15px/1.5 微软雅黑,tahoma,arial;}
    
         body{background:#efefef;}
    
         h1, h2, h3, h4, h5, h6 {font-size: 100%;cursor:default;}
    
         ul, ol {list-style: none outside none;}
    
         a {text-decoration: none;color:#447BC4}
    
         a:hover {text-decoration: underline;}
    
         .ip-attack{width:600px; margin:200px auto 0;}
    
         .ip-attack dl{ background:#fff; padding:30px; border-radius:10px;border: 1px solid #CDCDCD;-webkit-box-shadow: 0 0 8px #CDCDCD;-moz-box-shadow: 0 0 8px #cdcdcd;box-shadow: 0 0 8px #CDCDCD;}
    
         .ip-attack dt{text-align:center;}
    
         .ip-attack dd{font-size:16px; color:#333; text-align:center;}
    
         .tips{text-align:center; font-size:14px; line-height:50px; color:#999;}
    
     </style>
    
 <?php }?>

 </head>
    
 <body>
    
     <div class="ip-attack"><dl>
    
         <?php switch ($code) {?>
    
             <?php case 1:?>
    
             <dt style="color: green"><?php echo(strip_tags($msg));?></dt>
    
             <?php break;?>
    
             <?php case 0:?>
    
             <dt style="color: red"><?php echo(strip_tags($msg));?></dt>
    
             <?php break;?>
    
         <?php } ?>
    
         <br>
    
         <dt>
    
             页面自动 <a id="href" href="<?php echo($url);?>">跳转</a> 等待时间： <b id="wait"><?php echo($wait);?></b>
    
         </dt></dl>
    
     </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>

    over！over！over！

TP5之页面跳转样式的更多相关文章

  1. 【完美解决】vue，页面跳转样式错位但是刷新又好了的情况

    在vue文件中,做样式分离: 将覆盖样式单独写在一个style标签内,原页面写在 scoped样式作用域下.

  2. 页面跳转后样式丢失js失效

    2 页面跳转后样式丢失js失效 问题描述: 用ajax跳转的时候,从a.html跳转到b.html后,b.html的css以及js都失效了. 解决办法: 将当前页面需要用到的css以及js放在< ...

  3. jsp/servlet页面跳转丢失样式问题

    问题:使用servlet,如何处理在多路径页面跳转中servlet转发页面样式丢失问题?(例如访问 http://localhost/project/listUser.action后转到http:// ...

  4. request.getRequestDispatcher 页面跳转，样式丢失。

    在页面中引用样式和其它资源的时候,尽量不要用相对路径,因为"当前路径"这个概念在J2EE中是不稳定的. 所以最好都是绝对路径,类似于: <% String cp = requ ...

  5. thinkphp5(tp5)中success跳转页面和弹窗问题解决

    自己做了一个form页面,对其操作后,根据$this->success('提示信息',''),执行后是通过笑脸页面跳转,而不是在本页弹框后刷新.源码里带的原来的例子是弹出框刷新,为什么我自己做的 ...

  6. tp5页面跳转，空控制器空方法

    namespace app\index\controller; use think\Controller; class Login extends Controller{ //显示html页面 pub ...

  7. Controller中页面跳转完后页面的样式全消失的解决办法

    问题的原因应该是在controller中进行页面跳转时当前文件的路径变了 解决办法: 1.在jsp页面中<%@ page language="java" contentTyp ...

  8. jquerymobile页面跳转和参数传递

    http://blog.csdn.net/chen052210123/article/details/7481578 页面跳转: 页面跳转时pagebeforechange事件会被触发两次,通过$(d ...

  9. JQueryMobile页面跳转参数的传递解决方案

    在JQueryMobile开发手机端应用使用可能需要考虑相关的页面跳转带来的参数问题.因为JQueryMobile其实也是HTML5实践的结果.HTML5中有localStorage和sessionS ...

随机推荐

  1. pygame 安装教程

    步骤: 1.去官网下载PyGame 注意:要下载对应版本的包 官网地址:http://www.pygame.org/download.shtml 其中,如果python为以下版本: python 3. ...

  2. Apache JServ Protocol

    ajp_百度百科 https://baike.baidu.com/item/ajp/1187933 AJP(Apache JServ Protocol)是定向包协议.因为性能原因,使用二进制格式来传输 ...

  3. BZOJ2759: 一个动态树好题

    BZOJ2759: 一个动态树好题 Description 有N个未知数x[1..n]和N个等式组成的同余方程组:x[i]=k[i]*x[p[i]]+b[i] mod 10007其中,k[i],b[i ...

  4. Mac 下Java开发环境安装

    一.安装Eclipse 1.官网下载安装文件 http://www.eclipse.org/downloads 2.eclipse安装svn插件 这里须要注意安装的svn的版本号.要和后面的安装的Ja ...

  5. poj3461 Oulipo —— KMP

    题目链接:http://poj.org/problem?id=3461 代码如下: #include<cstdio>//poj 3461 kmp #include<cstring&g ...

  6. jmeter使用笔记——流程及常用组件配置

    添加线程组 线程数 :对应用户数, Ramp-Up: 多少秒启动这些线程,1秒代表1秒内启动设置的线程数,10秒代表10秒内启动线程数 循环次数: 每个线程执行线程组内的请求循环次数 调度器:可以对线 ...

  7. spring类扫描注入-----类扫描的注解解析器

    通过类扫描注入到容器中,这种方式,在实际开发中还是很常用的,可以看下自己的配置文件,就会发现,自己公司的项目,搞不好就是这么注入的. 起码,我发现我公司的项目就是这么干的. 下面来演示一下简单的例子: ...

  8. 基于BASYS2的VHDL程序与仿真——50%占空比8分频器

    转帖请注明转自http://www.cnblogs.com/connorzx/p/3547673.html 一.新建工程 1.点击File->New Project, 2.点击Next 注:此处 ...

  9. 作业：xml练习2-写.xml的外部约束文件（dtd文件）

    写外部DTD: 步骤: 1.在srd目录下新建DTD文件,并命名为:scores.dtd 2.在练习1的基础上,剪切练习1的DTD内部声明.粘贴到一个新建的DTD文件中.剪切之后的地方换上:包含外部D ...

  10. WPF-悬浮在底部的导航

    先用Rectangle代替导航按钮,这个导航会悬浮在界面的底部,当鼠标移进导航按钮上的时候,按钮会放大,移出后恢复正常.   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 1 ...