網頁中的浮動指示框

2024-09-05 12:18:20

字體：大中小

來源：轉載

供稿：網友

網頁中的浮動指示框，浮動提示框，用于顯示信息，可以使用HTML語法，注意引號用法，單套雙。
　　在JAVAsCRITP代碼內，變量displaymode有三種模式：0 代表信息永遠顯示，1 代表信息只顯示一段時間，2為隨機顯示模式；

<html><head><title>網頁中的浮動指示框</title><style  type="text/css"></style></head><body><script language="javascript">//顯示的信息，可以使用HTML語法，注意引號用法，單套雙。var message='<table border=1 width=100 bordercolorlight=000000 cellspacing= 0 cellpadding= 0 bordercolor=FFFFFF><tr><td width=100><font face="Arial"><b>News!</b></font></td></tr><tr><td width=100><nobr>本站功能已經開放。<br>中青隊四國邀請賽表現不俗。<br>源碼愛好者——請點擊這里</td></tr></table>'//背景色var backgroundcolor="#a0a0ff"http://0 代表信息永遠顯示，1 代表信息只顯示一段時間，2為隨機顯示模式；var displaymode=1//如果顯示模式為在指定時間內顯示，輸入時間段(1000為1秒)；var displayduration=10000//1代表閃爍，0代表不閃爍；var flashmode=1//如果設置了閃爍，輸入閃爍的顏色；var flashtocolor="e0e0ff"http:////下面不必修改////var which=0				//狀態標志function regenerate(){window.location.reload()		//刷新頁面}function regenerate2(){if (document.layers)setTimeout("window.onresize=regenerate",400)	//每400毫秒設定一次onresize屬性，以便在窗口改變大小時及時刷新}function display2(){if (document.layers){			//如果瀏覽器是NSif (topmsg.visibility=="show")		//如果浮動層當前可見topmsg.visibility="hide"		//則將其隱藏else					//否則topmsg.visibility="show"		//將其顯示出來}else if (document.all){			//如果瀏覽器是IEif (topmsg.style.visibility=="visible")	//如果浮動層當前可見topmsg.style.visibility="hidden"	//則將其隱藏else					//否則topmsg.style.visibility="visible"	//將其顯示出來//在10秒到20秒之間的隨機延時后重新執行，交替顯示和隱藏，形成閃爍效果。setTimeout("display2()",Math.round(Math.random()*10000)+10000)}}function flash(){				//形成閃爍效果if (which==0){					//根據狀態標志決定操作，如果需要改變背景色if (document.layers)				//如果是NStopmsg.bgColor=flashtocolor			//則利用bgColor改變背景色到flashtocolorelse						//如果是IEtopmsg.style.backgroundColor=flashtocolor	//則利用style.backgroundColor改變背景色到flashtocolorwhich=1						//切換狀態標志，下一次操作為恢復背景色}else{						//如果本次操作需要恢復背景色if (document.layers)				//如果是NStopmsg.bgColor=backgroundcolor			//則利用bgColor恢復背景色到backgroundcolorelse						//如果是IEtopmsg.style.backgroundColor=backgroundcolor	//則利用style.backgroundColor恢復背景色到backgroundcolorwhich=0						//切換狀態標志，下一次操作為改變背景色}}if (document.all){		//如果是IE，則寫入顯示所需要的浮動層.document.write('<span id="topmsg" style="position:absolute;visibility:hidden">'+message+'</span>')}function logoit(){							//以IE兼容方式調整浮動層位置document.all.topmsg.style.left=document.body.scrollLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2document.all.topmsg.style.top=document.body.scrollTop+document.body.clientHeight-document.all.topmsg.offsetHeight-4}function logoit2(){							//以NS兼容方式調整浮動層位置topmsg.left=pageXOffset+window.innerWidth/2-topmsg.document.width/2	//將浮動層調到頁面中部topmsg.top=pageYOffset+window.innerHeight-topmsg.document.height-5	//將浮動層調到頁面底部setTimeout("logoit2()",90)						//90毫秒后再次調整位置，以保持其始終居于頁面底部中間}function setmessage(){document.all.topmsg.style.left=document.body.scrollLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2	//設定浮動層在頁面中間document.all.topmsg.style.top=document.body.scrollTop+document.body.clientHeight-document.all.topmsg.offsetHeight-4	//設定浮動層在頁面底部document.all.topmsg.style.backgroundColor=backgroundcolor			//設定浮動層背景顏色document.all.topmsg.style.visibility="visible"					//將浮動層設為可見if (displaymode==1)								//如果只需要顯示一段時間setTimeout("topmsg.style.visibility='hidden'",displayduration)			//則用setTimeout設定超時，讓浮動層在一端時間后隱藏else if (displaymode==2)							//如果需要閃爍顯示display2()									//則調用display2過程進行隨即消隱顯示if (flashmode==1)								//如果需要閃爍setInterval("flash()",1000)							//設定每一秒進行一次閃爍window.onscroll=logoit								//當進行頁面卷動的時候重新調整層的位置window.onresize=new Function("window.location.reload()")			//當窗口改變大小時則刷新本頁}function setmessage2(){topmsg=new Layer(window.innerWidth)						//利用new Layer生成浮動層topmsg.bgColor=backgroundcolor							//設定浮動層的背景顏色regenerate2()									//調用regenerate2，以便在必要的時候刷新頁面topmsg.document.write(message)							//將消息內容以文本流形式寫進浮動層topmsg.document.close()								//關閉文本流logoit2()									//調整浮動層位置topmsg.visibility="show"							//使浮動層可見if (displaymode==1)								//如果只顯示一次setTimeout("topmsg.visibility='hide'",displayduration)				//則在延時displayduration毫秒后消隱浮動層else if (displaymode==2)							//如果是設定是隨機顯示display2()									//則調用display2進行隨機顯示if (flashmode==1)								//如果需要閃爍setInterval("flash()",1000)							//則設定閃爍時鐘}if (document.layers)		//如果是NSwindow.onload=setmessage2	//在頁面裝入的時候，啟動setmessage2else if (document.all)		//如果是IEwindow.onload=setmessage	//則在頁面裝入的時候啟動setmessage</script><font size=5><b>歡迎光臨我的網頁</b></font></body></html>

上一篇：隨日期播放網頁背景音樂

下一篇：JavaScript讓網頁定時刷新的特效