首先需要乙個遮罩層來實現灰色背景。我們可以建立乙個z-index高於其他層的div。然後設為絕對定位。接著獲取頁面的高度並把它作為這個div的高度。這樣背景層的問題就ok了；
背景層結構：
<
divid="
windownbg
"style="
height:
"+$(
document
).height
()+"
px;filter:alpha(opacity=0);opacity:0;z-index: 999901
">
div>
然後是彈出層的結構：
<
divid="
windown-box
">
<
divid="
windown-title
">
<
h2>
h2>
<
spanid=
"windown-close
">
關閉span
>
div>
<
divid="
windown-content-border
">
<
divid="
windown-content
">
div>
div>
div> if
(_version
== 6.0));
}else );};
定位問題解決了就好辦了。剩下的就是獲取內容和一些附加效果了。內容這裡可以設定的型別有5種。分別是：text、id、img、url、iframe 這個就不說了。附加效果就拖拽和自動關閉。拖拽這個東西有點複雜。但了解原理後也就不複雜了。首先是獲取對像的offsetleft和offsettop這兩個值。這兩個值是對像距離瀏覽器視窗左邊和上邊的距離。然後繫結滑鼠事件，當按下的時候計算滑鼠當前的座標clientx、clienty。並計算這兩個引數的差值得到新的座標movex、movey。當滑鼠拖動的時候。計算當前滑鼠的座標與之前得到的movex、movey之間的差值。這個值就是對像的新的座標了。把它符值給對像的top、left就實現了拖拽。
draghead
.onmousedown
= function(e
)elsee=
window
.event
?window
.event:e
;var
ol=
drag_id
.offsetleft
, ot
= drag_id
.offsettop
-movetop
;movex= e
.clientx-ol
;movey= e
.clienty-ot
;document
.onmousemove
= function(e
)}}}
自動關閉就很簡單了。就是乙個settimeout
自動關閉**：
varclosewindown
= function())
;}if(
time
== ""
|| typeof
(time
)==
"undefined")
);});
}else
製作彈出層
最近在做乙個公司部落格，頁面上用到了很多彈出層，於是大家就仿照著其他 上的彈出層做了乙個。提示 頁面彈出層樣式 background outdiv outtitle titlelayer closelayer outcontent outbottom outdiv input 頁面彈出層 funct...
Jquery彈出層外掛程式
size medium 此外掛程式可支援以下功能 1 觸發響應事件 2 設定彈出層的標題 3 設定彈出層型別 text 容器id url iframe 4 彈出層的內容獲取 text文字 容器id名稱 url位址 iframe的位址 5 彈出層的寬度 6 彈出層的高度 7 層滑動的高度也就是彈出層時...
jQuery彈出層外掛程式Dialog
dialogupdate author huang ji hua license freebsd license jquery的dialog外掛程式。param object content param object options 選項。return function dialog content...