【JavaScript】悬浮窗口

　2010-09-14 13:37:06　来源：WEB开发网　闂傚倸鍊搁崐椋庢濮橆兗缂氱憸宥堢亱闂佸湱铏庨崰鏍不椤栫偞鐓ラ柣鏇炲€圭€氾拷

闂傚倸鍊搁崐椋庣矆娓氣偓楠炲鏁撻悩鎻掔€梺姹囧灩閻忔艾鐣烽弻銉︾厵闁规鍠栭。濂告煕鎼达紕校闁靛洤瀚伴獮鎺楀箣濠靛啫浜鹃柣銏⑶圭壕濠氭煙閻愵剚鐏辨俊鎻掔墛缁绘盯宕卞Δ鍐冣剝绻涘畝濠佺敖缂佽鲸鎹囧畷鎺戭潩閹典焦鐎搁梻浣烘嚀閸ゆ牠骞忛敓锟�

婵犵數濮烽弫鍛婃叏椤撱垹绠柛鎰靛枛瀹告繃銇勯幘瀵哥畼闁硅娲熷缁樼瑹閳ь剙岣胯鐓ら柕鍫濇偪濞差亜惟闁宠桨鑳堕崝锕€顪冮妶鍡楃瑐闁煎啿鐖奸崺濠囧即閵忥紕鍘梺鎼炲劗閺呮稒绂掕缁辨帗娼忛埡浣锋闂佽桨鐒﹂幑鍥极閹剧粯鏅搁柨鐕傛嫹闂傚倸鍊搁崐椋庢濮橆兗缂氱憸宥堢亱闂佸湱铏庨崰鏍不椤栫偞鐓ラ柣鏇炲€圭€氾拷　　闂傚倸鍊搁崐鐑芥嚄閼哥數浠氱紓鍌欒兌缁垶銆冮崨鏉戠厺鐎广儱顦崡鎶芥煏韫囨洖校闁诲寒鍓熷铏圭磼濡搫顫岄梺鍦拡閸嬪棝鎯€椤忓浂妯勯梺鍝勬湰濞叉ḿ鎹㈠┑濠勭杸闁哄洨濮烽悰銉╂⒒娴ｅ搫甯跺鐟帮攻缁傚秴饪伴崼姘ｅ亾閺冨牆绀冩い蹇庣娴滈箖鏌ㄥ┑鍡涱€楀褜鍠栭湁闁绘ɑ鐟ョ€氼喚绮绘ィ鍐╃厱妞ゆ劑鍊曢弸搴ㄦ煟韫囧鍔滈柕鍥у瀵潙螣閸濆嫬袝婵＄偑鍊戦崹娲偡閳哄懎绠栭柍鈺佸暞閸庣喖鏌曢崶褍绨婚柟鍑ゆ嫹

核心提示：主要是window.onscroll的运用效果如图：代码如下：<html><head><title>悬浮窗口示例</title><scripttype="text/javascript">window.onscroll=function(

主要是window.onscroll的运用

效果如图：

【JavaScript】悬浮窗口

代码如下：

<html> 　　<head> 　　　　<title>悬浮窗口示例</title> 　　　　<scripttype="text/javascript"> 　　　　　　window.onscroll=function(){ 　　　　　　　　vardiv=document.getElementById("divSuspended"); 　　　　　　　　div.style.top=document.body.scrollTop; 　　　　　　} 　　　　　　window.onresize=window.onscroll; 　　　　　　functioninit(){ 　　　　　　　　vardf=document.createDocumentFragment(); 　　　　　　　　for(vari=0;i<20;i++){ 　　　　　　　　　　varp=document.createElement("p"); 　　　　　　　　　　p.appendChild(document.createTextNode("Line"+i)); 　　　　　　　　　　df.appendChild(p); 　　　　　　　　} 　　　　　　　　document.body.appendChild(df); 　　　　　　　　window.onscroll(); 　　　　　　} 　　　　</script> 　　</head> 　　<bodyonload="init()"> 　　　　<p>Tryscrollingthiswindow.</p> 　　　　<divid="divSuspended"style="position:absolute;buttom:0px;right:0px;color:#cccccc;width:150px;height:30px;background-color:navy">这是悬浮窗口</div> 　　</body> </html>