1、daocloud 自适应404
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="https://dn-daoerror-page.qbox.me/bower_components/normalize-css/normalize.css"> <link rel="stylesheet" href="https://dn-daoerror-page.qbox.me/styles/css/main.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://dn-daoerror-page.qbox.me/bower_components/jquery/dist/jquery.min.js"></script> <script src="https://dn-daoerror-page.qbox.me/bower_components/parallax/deploy/jquery.parallax.js"></script> </head> <body> <div id="container" class="error_404"> <ul id="scene"> <li class="layer" data-depth="0.10"><div class="star diamond"></div></li> <li class="layer" data-depth="0.30"><div class="star dot"></div></li> <li class="layer" data-depth="0.50"><div class="star sparkle"></div></li> <li class="layer" data-depth="0.05"><div class="lighthouse"></div></li> <li class="layer" data-depth="0.20"><div class="wave dark-blue depth-20"></div></li> <li class="layer" data-depth="0.40"><div class="wave medium-blue depth-40"></div></li> <li class="layer" data-depth="0.60"><div class="wave light-blue depth-60"></div></li> <li class="layer" data-depth="0.00"> <div class="error-message"> <p>肆零肆，你见，或者不见，他就在这里。不悲，不喜。</p> <div class="button"><a href="https://www.daocloud.io">回到首页</a></div> </div> </li> </ul> </div> </body> <script type="text/javascript"> $('#scene').parallax({ invertX: false, invertY: false, limitX: false, limitY: false, scalarX: 10, scalarY: 8, frictionX: 0.5, frictionY: 0.5 }); </script> </html>
2、鸟云自动跳转404
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>该页面不存在</title> <link rel="stylesheet" href="https://www.niaoyun.com//template/Error/404/css/reset.css"/> <link rel="stylesheet" href="https://www.niaoyun.com//template/Error/404/css/404.css"> <script src="https://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> </head> <body> <div class="auto"> <div class="container"> <div class="settings"> <i class="icon"></i> <h4>很抱歉！没有找到您要访问的页面！</h4> <p><span id="num">5</span> 秒后将自动跳转到首页</p> <div> <a href="/" title="返回首页">返回首页</a> <a href="javascript:;" title="上一步" id="reload-btn">上一步</a> </div> </div> </div> </div> <script> //倒计时跳转到首页的js代码 var $_num=$("#num"); var num=parseInt($_num.html()); var numId=setInterval(function(){ num--; $_num.html(num); if(num===0){ //跳转地址写在这里 window.location.href="/Home/Index/index.html"; } },1000); //返回按钮单击事件 var reloadPage = $("#reload-btn"); reloadPage.click(function(e){ window.history.back(); }); </script> </body> </html>