error.html 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. <!doctype html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>跳转提示</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  7. <style type="text/css">
  8. * {
  9. padding: 0;
  10. margin: 0;
  11. box-sizing: border-box;
  12. }
  13. img {
  14. max-width: 100%;
  15. }
  16. body{
  17. background: teal;
  18. font-family: '微软雅黑';
  19. color: #fff;
  20. font-size: 16px;
  21. }
  22. .message-box{
  23. width: 500px;
  24. padding: 20px;
  25. margin: 8% auto;
  26. text-align: center;
  27. overflow: hidden;
  28. }
  29. .message-box .message-header {
  30. margin-bottom: 20px;
  31. }
  32. .message-box .message-header a {
  33. font-size: 50px;
  34. text-decoration: none;
  35. }
  36. .message-box .message-header a:hover {
  37. text-decoration: none;
  38. }
  39. .message-box .message-header .logo {
  40. width: 350px;
  41. }
  42. .message-box .message-body h1 {
  43. font-size: 50px;
  44. font-weight: normal;
  45. line-height: 60px;
  46. margin-bottom: 12px
  47. }
  48. .message-box .message-body .jump {
  49. padding-top: 10px;
  50. margin-bottom:20px
  51. }
  52. .message-box .message-body .jump a {
  53. color: #333;
  54. }
  55. .message-box .message-body .success,
  56. .message-box .message-body .error {
  57. font-size: 36px
  58. }
  59. .message-box .message-body .detail {
  60. font-size: 12px;
  61. line-height: 20px;
  62. margin-bottom: 12px;
  63. display:none
  64. }
  65. .message-box .message-action .btn {
  66. display: inline-block;
  67. margin-right: 10px;
  68. font-size: 16px;
  69. line-height: 18px;
  70. text-align: center;
  71. vertical-align: middle;
  72. cursor: pointer;
  73. border: 0 none;
  74. background-color: #8B0000;
  75. padding: 10px 20px;
  76. color: #fff;
  77. font-weight: bold;
  78. border-color: transparent;
  79. text-decoration:none;
  80. }
  81. .message-box .message-action .btn:hover {
  82. background-color: #ff0000;
  83. }
  84. @media (max-width: 768px) {
  85. .message-box {
  86. width: 100%;
  87. }
  88. .message-box .message-header .logo {
  89. width: 200px;
  90. }
  91. .message-box .message-body h1 {
  92. display: none;
  93. }
  94. .message-box .message-body {
  95. margin-bottom: 60px;
  96. }
  97. .message-box .message-action .btn{
  98. display: block;
  99. width: 100%;
  100. margin-bottom: 10px;
  101. }
  102. }
  103. </style>
  104. </head>
  105. <body>
  106. <div class="message-box">
  107. <div class="message-header">
  108. <php>if(C('WEB_SITE_LOGO')):</php>
  109. <a href="{:C('HOME_PAGE')}"><img class="logo" src="{$Think.config.WEB_SITE_LOGO|get_cover}"></a>
  110. <php>else:</php>
  111. <a href="{:C('HOME_PAGE')}"><span>{:C('LOGO_DEFAULT')}</span></a>
  112. <php>endif;</php>
  113. </div>
  114. <div class="message-body">
  115. <h1>友情提醒!</h1>
  116. <p class="error"><?php echo($error); ?></p>
  117. <p class="detail"></p>
  118. <p class="jump">
  119. <b id="wait"><?php echo($waitSecond); ?></b> 秒后页面将自动跳转
  120. </p>
  121. </div>
  122. <div class="message-action">
  123. <a class="btn" id="btn-now" href="<?php echo($jumpUrl); ?>">立即跳转</a>
  124. <a class="btn" id="btn-stop" onclick="stop()">停止跳转</a>
  125. <a class="btn" id="btn-now" href="<?php echo(C('HOME_PAGE')); ?>">返回首页</a>
  126. </div>
  127. </div>
  128. <script type="text/javascript">
  129. (function(){
  130. var wait = document.getElementById('wait');
  131. var btn = document.getElementById('btn-now').href;
  132. var interval = setInterval(function(){
  133. var time = --wait.innerHTML;
  134. if(time <= 0) {
  135. location.href = btn;
  136. clearInterval(interval);
  137. };
  138. }, 1000);
  139. window.stop = function (){
  140. clearInterval(interval);
  141. }
  142. })();
  143. </script>
  144. </body>
  145. </html>