程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> PHP綜合 >> 解決控件遮擋問題:關於有窗口元素和無窗口元素

解決控件遮擋問題:關於有窗口元素和無窗口元素

編輯:PHP綜合
不知道朋友們有沒有碰到過控件的遮擋問題,最典型的就是DropdownList和ActiveX的遮擋,HTML的z-index就是用於處理這個問題,但是直接設置這個屬性還不行,因為這中間還牽扯到有窗口元素和無窗口元素的問題。


有窗口元素大概有以下幾種: 
<object> 、ActiveX控件 、Plug-ins、DHTML Scriptlets、SELECT elements(即DropdownList的HTML表現)、IE5.01以前的IFRAMEs 


無窗口元素包括: 
無窗口的ActiveX控件、IE5.5以後的IFRAMEs、大部分的DHTML元素 


其中很值得一提的就是ActiveX控件,默認情況下,VB和MFC的控件是有窗口的,ATL控件是無窗口的,但是ActiveX控件是作為無窗口來進行實現而且實際上被歸類到無窗口元素中。 


不管容器怎麼設定,所有的有窗口元素都會出現在無窗口的元素之上,有窗口元素和無窗口元素內部自身互相會遵循z-index屬性,它們會被繪制在不同的平面上進行顯示,設置z-index只能對它們所在的平面起作用,而且有窗口元素的平面始終處於無窗口元素平面之上。 


那麼解決遮擋問題的思路就很簡單了,把我們的元素封裝進一個DIV中,代碼示例如下: 

<DIV id="PAL2" style="DISPLAY: inline; Z-INDEX: 8; LEFT: 80px; WIDTH: 360px; POSITION: absolute; TOP: 80px; HEIGHT: 168px"> 
<OBJECT id="dhtmltest" style="Z-INDEX: 8; WIDTH: 352px; HEIGHT: 168px" type="text/x-scriptlet" data="TestDivDropdownList.htm" VIEWASTEXT> 
</OBJECT></DIV> 

DIV的z-index為8,然後將SELECT的z-index調為7即可(只需要比DIV的z-index小)。
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved