157ad27c00f93a337df4ad6bf5ff3f05.php 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <?php /*a:1:{s:59:"D:\phpstudy_pro\WWW\cxy\bts\php\view\admin\error\error.html";i:1581911356;}*/ ?>
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <meta charset="UTF-8">
  6. <title>404</title>
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta http-equiv="Access-Control-Allow-Origin" content="*">
  9. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  10. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  11. <meta name="apple-mobile-web-app-capable" content="yes">
  12. <meta name="format-detection" content="telephone=no">
  13. <link rel="stylesheet" href="/static/plugins/layui/css/layui.css" media="all">
  14. <style>
  15. .error .clip .shadow {height:180px;}
  16. .error .clip:nth-of-type(2) .shadow {width:130px;}
  17. .error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow {width:250px;}
  18. .error .digit {width:150px;height:150px;line-height:150px;font-size:120px;font-weight:bold;}
  19. .error h2 {font-size:32px;}
  20. .error .msg {top:-190px;left:30%;width:80px;height:80px;line-height:80px;font-size:32px;}
  21. .error span.triangle {top:70%;right:0%;border-left:20px solid #535353;border-top:15px solid transparent;border-bottom:15px solid transparent;}
  22. .error .container-error-404 {top: 50%;margin-top: 250px;position:relative;height:250px;padding-top:40px;}
  23. .error .container-error-404 .clip {display:inline-block;transform:skew(-45deg);}
  24. .error .clip .shadow {overflow:hidden;}
  25. .error .clip:nth-of-type(2) .shadow {overflow:hidden;position:relative;box-shadow:inset 20px 0px 20px -15px rgba(150,150,150,0.8),20px 0px 20px -15px rgba(150,150,150,0.8);}
  26. .error .clip:nth-of-type(3) .shadow:after,.error .clip:nth-of-type(1) .shadow:after {content:"";position:absolute;right:-8px;bottom:0px;z-index:9999;height:100%;width:10px;background:linear-gradient(90deg,transparent,rgba(173,173,173,0.8),transparent);border-radius:50%;}
  27. .error .clip:nth-of-type(3) .shadow:after {left:-8px;}
  28. .error .digit {position:relative;top:8%;color:white;background:#1aa094;border-radius:50%;display:inline-block;transform:skew(45deg);}
  29. .error .clip:nth-of-type(2) .digit {left:-10%;}
  30. .error .clip:nth-of-type(1) .digit {right:-20%;}
  31. .error .clip:nth-of-type(3) .digit {left:-20%;}
  32. .error h2 {font-size:24px;color:#A2A2A2;font-weight:bold;padding-bottom:20px;}
  33. .error .tohome {font-size:16px;color:#07B3F9;}
  34. .error .msg {position:relative;z-index:9999;display:block;background:#535353;color:#A2A2A2;border-radius:50%;font-style:italic;}
  35. .error .triangle {position:absolute;z-index:999;transform:rotate(45deg);content:"";width:0;height:0;}
  36. @media(max-width:767px) {.error .clip .shadow {height:100px;}
  37. .error .clip:nth-of-type(2) .shadow {width:80px;}
  38. .error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow {width:100px;}
  39. .error .digit {width:80px;height:80px;line-height:80px;font-size:52px;}
  40. .error h2 {font-size:18px;}
  41. .error .msg {top:-110px;left:15%;width:40px;height:40px;line-height:40px;font-size:18px;}
  42. .error span.triangle {top:70%;right:-3%;border-left:10px solid #535353;border-top:8px solid transparent;border-bottom:8px solid transparent;}
  43. .error .container-error-404 {height:150px;}
  44. }
  45. </style>
  46. </head>
  47. <body>
  48. <div class="error">
  49. <div class="container-floud">
  50. <div style="text-align: center">
  51. <div class="container-error-404">
  52. <div class="clip">
  53. <div class="shadow">
  54. <span class="digit thirdDigit"></span>
  55. </div>
  56. </div>
  57. <div class="clip">
  58. <div class="shadow">
  59. <span class="digit secondDigit"></span>
  60. </div>
  61. </div>
  62. <div class="clip">
  63. <div class="shadow">
  64. <span class="digit firstDigit"></span>
  65. </div>
  66. </div>
  67. <div class="msg">OH!
  68. <span class="triangle"></span>
  69. </div>
  70. </div>
  71. <h2 class="h1">很抱歉,你访问的页面找不到了</h2>
  72. </div>
  73. </div>
  74. </div>
  75. <script src="/static/plugins/layui/layui.js" charset="utf-8"></script>
  76. <script>
  77. function randomNum() {
  78. return Math.floor(Math.random() * 9) + 1;
  79. }
  80. var loop1, loop2, loop3, time = 30, i = 0, number;
  81. loop3 = setInterval(function () {
  82. if (i > 40) {
  83. clearInterval(loop3);
  84. document.querySelector('.thirdDigit').textContent = 4;
  85. } else {
  86. document.querySelector('.thirdDigit').textContent = randomNum();
  87. i++;
  88. }
  89. }, time);
  90. loop2 = setInterval(function () {
  91. if (i > 80) {
  92. clearInterval(loop2);
  93. document.querySelector('.secondDigit').textContent = 0;
  94. } else {
  95. document.querySelector('.secondDigit').textContent = randomNum();
  96. i++;
  97. }
  98. }, time);
  99. loop1 = setInterval(function () {
  100. if (i > 100) {
  101. clearInterval(loop1);
  102. document.querySelector('.firstDigit').textContent = 4;
  103. } else {
  104. document.querySelector('.firstDigit').textContent = randomNum();
  105. i++;
  106. }
  107. }, time);
  108. </script>
  109. </body>
  110. </html>