项目是要一点点按优先级进行优化的，现在到优化thinkphp的跳转页了。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
<?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 跳转页封装示例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持服务器之家。
原文链接：https://blog.csdn.net/u013288190/article/details/54908718
