IE6中iframe出現橫向滾動條的解決方案

2022-04-29 16:45:06 字數 758 閱讀 1507

ie6中iframe出現橫向滾動條的解決方案

方案一:給該框架的頁內加上以下樣式

html

注意,是指該框架的頁內新增,不是在全域性的樣式中新增。這種方案是網上給出的最多的方案,橫向超出就隱藏,縱向超出讓他自動。這樣ie6下橫向滾動條確實是沒有了,可是這樣我們會發現內容盒子的右邊會缺失了17px的寬度,為什麼?這是因為overflow-x:hidden隱藏掉的是內容盒子裡原橫向右邊的寬度,也就是等於滾動條的寬度。

所以,方案一是一種不完美的解決方案。

方案二:給該框架的頁內加上以下樣式

html

注意,這也是指該框架的頁內新增,不是在全域性的樣式中新增。這種方案比第一種好,橫向滾動條消失了,內容盒子的寬度也沒有被隱藏掉,即沒有減少。但是你再細心點就會發現,這時無論是什麼時候縱向都會預留有滾動條的位置,當框架裡內容很長,需要縱向滾動條的時候,顯示會正常;但是當框架裡內容很少,根本不需要縱滾動條的的時候,它也會出現一條灰色的滾動條框。

我想這也不是我們想要的最終效果。

方案三:使用jq解決

既然我們用css樣式都不能完美解決我們的問題,那就只有動用同樣強大的jq了:

$(function

() )

這種方案的解決思路是用jq進行判斷,當當前的瀏覽器是ie6時,並且灰色滾動條框大於frame/iframe框架高度的時候就應用方案二,否則將不採取任何措施

iframe在IE6下出現橫向滾動條的解決方案

最近的專案中,遇到ie6下當iframe出現縱向滾動條時同時會出現橫向滾動條。分析了 大致的原因是iframe中的頁面有相對body的樣式包含width 100 的元素。情況如下 ps 紅框表示iframe的區域,灰色的長方框表示上面提到的width 100 的元素,需要在ie6下看效果。當灰色的框...

ie6取消橫向滾動條

本文技術 與網路,連線如下,感謝大家分享,著急的可以直接將下面的css樣式載入到自己頁面中即可,新手,有問題還請多多包涵,共同進步 html,body update 2014 09 15 按照上述修改之後,能解決部分橫屏問題,但是有時候還是不給力 發現新的方法,參見連線 感謝各位大神的分享啦 ove...

IE6去除iframe滾動條

在頁面上引用frame或者iframe,在ie6瀏覽器下,可能出現橫向滾動條,如果使用scroling no 會消除縱向的滾動條。好,那也有可能在body標籤或css裡面定義overflow x hidden overflow y auto 這兩個引數,但是仍舊那討厭的橫向滾動條還在。這是為什麼呢?...