源码介绍
酷炫末世意境配景404单页HTML源码，配景布满着破坏一切的意境，彷佛末世的到来，可以做网站错误页或者丢失页面，将下面的代码放到空白的HTML内里，然后上传到服务器内里，设置好重定向即可
结果预览
完整源码
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>404 Apocalypse</title>
- <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css"/>
- <style>@import url(https://fonts.googleapis.com/css?family=Sigmar+One);
- @import url(https://fonts.googleapis.com/css?family=Poiret+One);
- body {
- background-image:url('https://wallpapercave.com/wp/jj5KxtS.jpg');
- background-attachment:fixed;
- background-size:cover;
- background-color: #222;
- margin:0px;
- padding:0px;
- overflow:hidden;
- font-family: 'Poiret One', cursive;
- }
- h1
- {
- font-size:200px;
- width:100vw;
- text-align:center;
-
- color:rgba(0,255,0,1);
- font-family: 'Poiret One', cursive;
- }
- span
- {
- cursor:move;
- }
- .underline
- {
- font-size:50px;
- color:white;
- text-align:center;
- }
- .button
- {
- font-size:50px;
- color:white;
-
- font-family: 'Poiret One', cursive;
-
- text-align:center;
- }
- .button span
- {
- cursor:pointer;
- padding:10px;
-
- border-style:solid;
- border-radius:5px;
-
- transition:border-color 0.75s;
- -webkit-transition:border-color 0.75s;
- }
- .button span:hover
- {
- border-color:rgb(0,255,0);
- }</style>
- </head>
- <body>
- <div class='underline'>
- <span>Sorry</span><span>, </span><span>this </span><span>page </span><span>didn</span><span>'</span><span>t</span><span> survive</span>
- </div>
- <h1><span>4</span><span>0</span><span>4</span></h1>
- <div class='button'><a title='https://www.qqmu.com'><span >Join the survivors</span></a></div>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
- <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
- <script src="https://cdn.rawgit.com/tinybigideas/jGravity/f3265bdd/jGravity-min.js"></script>
- <script>/* refresh if you didn't have body's background which appears*/
- $(function() {
- $(document).ready(function() {
- var one =false;
-
- $('.button span').mouseover(function(){
- if(!one){
- $('body').jGravity({
- target: 'span',
- ignoreClass: 'dontMove',
- weight: 25,
- depth: 100,
- drag: true
- });
- one =true;
- };
- });
-
-
- });
- });</script>
- </body>
- </html>
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。 |
