送上一款又简结又漂亮的跳转提示模板
送上一款又简结又漂亮的跳转提示模板
提示框上下左右都是居中的哈
//----------------------------------------------------------<br>
//来源: 梦雪网络 <br>
//作者: 小曾<br>
//扣扣: 839024615<br>
//交流群 324098841<br>
//----------------------------------------------------------<br>
<br>
<br>
//上代码<br>
<br>
<br>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br>
<html xmlns="http://www.w3.org/1999/xhtml"><br>
<head><br>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br>
<title>跳转提示</title><br>
<style type="text/css"><br>
*{ padding: 0; margin: 0; }<br>
body{ background: #fff; font-family: '微软雅黑'; color: #CCC; font-size: 16px; }<br>
.system-message{ padding: 24px 48px; margin:auto; border: #CCC 3px solid; top:50%; width:500px; border-radius:10px;<br>
-moz-border-radius:10px; /* Old Firefox */}<br>
.system-message h1{ font-size: 100px; font-weight: normal; line-height: 120px; margin-bottom: 5px; }<br>
.system-message .jump{ padding-top: 10px; color: #999;}<br>
.system-message .success,.system-message .error{ line-height: 1.8em; color: #999; font-size: 36px; font-family: '黑体'; }<br>
.system-message .detail{ font-size: 12px; line-height: 20px; margin-top: 12px; display:none}<br>
</style><br>
<script type='text/javascript' src='http://ajax.useso.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=3.4.2'></script><br>
<script type="text/javascript"><br>
$(function(){<br>
var height2=$('.system-message').height();<br>
var height1=$(window).height();<br>
$('.system-message').css('margin-top',((height1-height2)/2)-30);<br>
});<br>
<br>
</script><br>
<!-- Bootstrap core CSS --><br>
<link href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"><br>
</head><br>
<body><br>
<div class="system-message"><br>
<present name="message"><br>
<h1 class="glyphicon glyphicon-ok-circle" style="color:#09F"></h1><br>
<p class="success"><?php echo($message); ?></p><br>
<else/><br>
<h1 class="glyphicon glyphicon-exclamation-sign" style="color:#F33"></h1><br>
<p class="error"><?php echo($error); ?></p><br>
</present><br>
<p class="detail"></p><br>
<p class="jump"><br>
页面自动 <a id="href" class="text-primary" href="<?php echo($jumpUrl); ?>">跳转</a> 等待时间： <b id="wait"><?php echo($waitSecond); ?></b><br>
</p><br>
</div><br>
<script type="text/javascript"><br>
(function(){<br>
var wait = document.getElementById('wait'),href = document.getElementById('href').href;<br>
var interval = setInterval(function(){<br>
var time = --wait.innerHTML;<br>
if(time <= 0) {<br>
location.href = href;<br>
clearInterval(interval);<br>
};<br>
}, 1000);<br>
})();<br>
</script><br>
</body><br>
</html>
AD：真正免费，域名 虚机 企业邮箱=0元
-
2024-10-22 09:46:29
-
2024-10-13 13:53:41
-
2024-10-12 12:15:51
-
2024-10-11 22:47:31
-
2024-10-11 19:36:51
-
2024-10-11 15:50:41
-
2024-10-11 15:07:41
-
2024-10-11 14:21:21
-
2024-10-11 12:59:11
-
2024-10-11 12:17:31
-
-
php入门教程之一周学会PHP4265497 -
JAVA 初级入门视频教程2517169 -
小甲鱼零基础入门学习Python视频教程506305 -
PHP 零基础入门教程861492
