系统登录首页常用案例：
<body class="signin" >
<audio src="/imgUpload/music.mp3" autoplay="true" loop="0"></audio> <!--背景音乐 -->
<div class="signinpanel" id="signinpanel">
<div class="row" id="row">
<form id="signupForm">
<h4 class="no-margins">登录：</h4>
<input type="text" name="username" class="form-control uname" placeholder="用户名" />
<input type="password" name="password" class="form-control " placeholder="密码" />
<button class="btn btn-success btn-block">登录</button>
<a href="/reset"><input style="width: 100%" type="button" class="btn btn-success "value="重置密码"></input></a>
</form>
</div>
<div id="message" ><h3 style="color:red">系统有大的更新，请手动清理浏览器缓存，以免影响正常功能使用！</h3><h5>(如果已清理，请忽略！)</h5></div>
</div>
</body>
<script type="text/javascript">
1.显示系统维护，隐藏登录信息
$(function() {
document.getElementById("row").style.display="none";
var myDiv = document.getElementById(‘signinpanel‘); //获得dom对象
myDiv.innerHTML = myDiv.innerHTML+‘<div style="color:black;font-size:35px;font-weight:bold;">温馨提示:<br/>系统正在维护中，11月15日可以正常使用！‘+
‘<img style="height: 50px; width: 50px" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1573622849052&di=0e6e11c3c5d5fe856ac359e7a2dc0d94&imgtype=0&src=http%3A%2F%2Fimage.biaobaiju.com%2Fuploads%2F20190401%2F22%2F1554129886-KSrbTfRMVy.jpg"></div>‘;
return false;
});
2.在xxxx日期之前提示用户清理缓存，之后就消失
var div = document.getElementById("message");
window.onload = function () {
div.style.display=‘block‘;
var nowtime = new Date();
var endtime = new Date(‘2019/12/16,17:57:00‘);
var time= parseInt((endtime.getTime() - nowtime.getTime()) / 1000);
window.setTimeout("tick()",time);
};
3.给固定值5秒，时间到后消失
window.setTimeout("tick()",5000);
function tick(){ div.style.display=‘none‘; }
原文地址：https://www.cnblogs.com/leigei-it/p/11957970.html
时间： 2024-11-09 09:45:37