js操作frame进行消息提示
如题index.html
top.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><script language="javascript" type="text/javascript" src="js/jquery.js"></script><script language="javascript" type="text/javascript">var mainFrame;//framevar mainDoc;//docvar msgDivHtml = '<div id="msgDiv">消息提示</div>';//htmlvar msgDiv;//divvar height;//高度var opacity;//透明度var l;var s;var h;var t;var isShow = true;//是否每隔一段时间就显示一次var autoHideSecond=5;//自动隐藏时间,5秒window.onload = function(){t = window.setInterval('setDateTime()',1000);mainFrame = self.parent.frames['mainFrame'];loadMsg();};function setDateTime(){var today = new Date();var h = today.getHours();var m = today.getMinutes();var s = today.getSeconds();document.getElementById('dateTime').innerHTML = h+':'+m+':'+s;}function updateMsgDiv(){mainDoc = mainFrame.document;msgDiv = mainDoc.getElementById('msgDiv');}//向后台获取信息function loadMsg(){//clearwindow.clearTimeout(s);window.clearTimeout(h);var topCount = 4;//假设向后台获取到消息条数了updateMsgDiv();var body = mainDoc.body;if(!msgDiv){$(body).append(msgDivHtml);updateMsgDiv();}//加载html片段完成//添加计时器弹出效果//还原透明度msgDiv.style.height = 1+'px';setAlpha(msgDiv,100);//还原高度showMsg();l = window.setTimeout('loadMsg()',10000);}//显示divfunction showMsg(){updateMsgDiv();if(!msgDiv)return;height = window.parseInt(msgDiv.offsetHeight);if(height<=120){msgDiv.style.height = (height+4)+'px';s = window.setTimeout('showMsg()',20);}else{window.clearTimeout(s);//10秒后关闭opacity = 100;h = window.setTimeout('hideMsg()',autoHideSecond*1000);}}//设置透明度function setAlpha(div,v){if(!div)return;if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){ div.style.opacity = v/100; }else if(navigator.userAgent.indexOf("MSIE")>0) { div.style.filter = 'Alpha(Opacity='+v+')'; }}//隐藏divfunction hideMsg(){updateMsgDiv();if(opacity>=2){opacity = opacity-2;setAlpha(msgDiv,opacity);h = window.setTimeout('hideMsg()',20);}else{window.clearTimeout(h);}}//设置显示状态function setShowState(){if(isShow){isShow = false;window.clearTimeout(l);}else{isShow = true;loadMsg();}}</script></head><body>top.html<br/>时间:<span id="dateTime"></span><br/>开启消息提示:<input type="checkbox" onclick="setShowState();" checked="checked"/><button onclick="loadMsg();">load</button></body></html>?