頂部導航條固定不動,適合ie6789,chrome,fox

最近在做站的時候,需要頂部導航條固定不動,要適應所有瀏覽器

代碼如下:

.header-wrapper {
   background-color: #ccc;;
   left: 0;
   position: fixed;
   top: 0;
   width: 100%;
   z-index: 1000;
 }

<div class="header-wrapper">導航條固定在頂部不動</div>

在IE789,chrome,fox下瀏覽,正常,但在IE6下不行

IE6以上版本的IE瀏覽器及其他主流瀏覽器都是支持“position:fixed”的,但是IE6卻不支持它。幸好,IE6 支持“position:absolute” 和 Internet Explorer 的CSS表達式(expression)。所以,對於別的瀏覽器,我們可以用“position:fixed” 進行固定定位,而對於IE6,我們可以用“position:absolute” 和CSS表達式,

加入代碼:

/*ie6下樣式,加下劃線表示只針對ie6 的hack*/
 _position:absolute; /* 把導航欄位置定義爲絕對位置 */
 _top:expression(eval(document.documentElement.scrollTop)); /* 把導航欄位置放在瀏覽器垂直滾動條的頂端 */

IE6下顯示正常

摘自:http://lg0391.blog.163.com/blog/static/113312620142801638402/


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章