<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>即将奔赴</title> <link rel="shortcut icon" href="链接"> <style type="text/css"> * { color: #111827; } a { text-decoration: none; } .blink { position: fixed; height: 100%; width: 100%; text-align: center; display: flex; display: -webkit-flex; align-items: center; justify-content: center; animation: blink 3s linear infinite; -webkit-animation: blink 3s linear infinite; -moz-animation: blink 3s linear infinite; -ms-animation: blink 3s linear infinite; -o-animation: blink 3s linear infinite; } .all_bg{ position:fixed; top: 0; left: 0; width:100%; height:100%; min-width: 780px; z-index:-10; zoom: 1; background-color: #fff; background: url(链接); background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; -o-background-size: cover; background-position: center 0; } @keyframes blink { 0% { opacity: 0; transform: scale(1); } 20% { opacity: 0; transform: scale(1); } 40% { opacity: 0.3; transform: scale(1); } 80% { opacity: 1; transform: scale(0.98); } 90% { opacity: 1; transform: scale(0.98); } 100% { opacity: 0.2; transform: scale(1.2); } } @-webkit-keyframes blink { 0% { opacity: 0; transform: scale(1); } 20% { opacity: 0; transform: scale(1); } 40% { opacity: 0.3; transform: scale(1); } 80% { opacity: 1; transform: scale(0.98); } 90% { opacity: 1; transform: scale(0.98); } 100% { opacity: 0.2; transform: scale(1.2); } } @-moz-keyframes blink { 0% { opacity: 0; transform: scale(1); } 20% { opacity: 0; transform: scale(1); } 40% { opacity: 0.3; transform: scale(1); } 80% { opacity: 1; transform: scale(0.98); } 90% { opacity: 1; transform: scale(0.98); } 100% { opacity: 0.2; transform: scale(1.2); } } @-ms-keyframes blink { 0% { opacity: 0; transform: scale(1); } 20% { opacity: 0; transform: scale(1); } 40% { opacity: 0.3; transform: scale(1); } 80% { opacity: 1; transform: scale(0.98); } 90% { opacity: 1; transform: scale(0.98); } 100% { opacity: 0.2; transform: scale(1.2); } } @-o-keyframes blink { 0% { opacity: 0; transform: scale(1); } 20% { opacity: 0; transform: scale(1); } 40% { opacity: 0.3; transform: scale(1); } 80% { opacity: 1; transform: scale(0.98); } 90% { opacity: 1; transform: scale(0.98); } 100% { opacity: 0.2; transform: scale(1.2); } } .botCenter { position: fixed; width: 100%; height: 50px; bottom: 2px; line-height: 20px; font-size: 12px; text-align: center; animation: botCenter 3s linear; -webkit-animation: botCenter 3s linear; -moz-animation: botCenter 3s linear; -ms-animation: botCenter 3s linear; -o-animation: botCenter 3s linear; } @keyframes botCenter { 0% { opacity: 0; } 20% { opacity: 0; } 40% { opacity: 0.3; } 80% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 1; } } @-webkit-keyframes botCenter { 0% { opacity: 0; } 20% { opacity: 0; } 40% { opacity: 0.3; } 80% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 1; } } @-moz-keyframes botCenter { 0% { opacity: 0; } 20% { opacity: 0; } 40% { opacity: 0.3; } 80% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 1; } } @-ms-keyframes botCenter { 0% { opacity: 0; } 20% { opacity: 0; } 40% { opacity: 0.3; } 80% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 1; } } @-o-keyframes botCenter { 0% { opacity: 0; } 20% { opacity: 0; } 40% { opacity: 0.3; } 80% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 1; } } </style> </head> <body> <div class="blink"> <a href="链接" target="_blank" title="点击加入“奔赴”，分享网站流量 :-)">欢迎回来，即将奔赴<br />Welcome back, coming soon...</a> </div> <script> function jumpUrl(){ var arr = new Array( "随机链接1", "随机链接2", "随机链接3", "随机链接4", "随机链接5", ); window.location.href = arr[Math.floor(Math.random() * arr.length)]; } setTimeout(function () { jumpUrl();},5000);//设定跳转时间，1s=1000 </script> <div class="all_bg"></div> </body> </html>
HTML+JS+CSS 实现随机跳转到一个网址
免责声明！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。