首頁 >web前端 >css教學 >Firefox2中輸入框丟失遊標bug的解決方法_經驗交流

Firefox2中輸入框丟失遊標bug的解決方法_經驗交流

WBOY
WBOY原創
2016-05-16 12:05:471427瀏覽

雖然慶幸的是Firefox3中解決了這個bug,但Firefox3還在beta階段,取代Firefox2還是需要一些時間的,下面就來仔細說一下這個問題:

一、樣式為{position:absolute; }的容器中的表單輸入框在樣式為類似{overflow:auto;}的容器區域中失去遊標
可以透過例一到例六來了解最常見的情況。

如果想整個body都出現失去遊標,可以設定html和body兩個容器,請看範例。包含舉例的overflow:auto在內能造成此Bug的overflow屬性共有:

overflow:auto 
overflow-x:auto; 
overflow-y:auto; 
overflow:scroll ; 
overflow-x:scroll; 
overflow-y:scroll; 
overflow-x:hidden; 
overflow-y:hidden; 
除了避免使用overflow屬性的其他解決方案:

利用overflow:hidden取代產生bug的oveflow屬性 
在具有上述overflow屬性的容器中加入position:relative,請看實例。
在positon:absolute的容器上加入同樣的oveflow屬性,同時注意在頁面出現的順序,見例四 
為使用能產生bug的oveflow屬性的容器選擇合適的標籤,例如fieldset,見例六。 
二、樣式為{position:absolute;}的容器中的表單輸入框在iframe容器區域中失去遊標
可以透過例七來了解這個情況。 IE6中為了解決下拉清單層級過高問題,往往需要用iframe來遮蓋它,偶爾疏忽忘記做瀏覽器限定就有可能導致上面的問題。

現在看來Firefox2對iframe的處理bug還真不少,例如以前就發現了Firefox返回時Iframe的顯示Bug。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn