权祖

系统登录首页信息维护

系统登录首页常用案例：

<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'; }

//style.display="block"为显示，display="none"为隐藏

posted on 2019-11-29 15:20  IT磊哥  阅读(443)  评论(0)    收藏  举报

导航