3
我該如何改變iframe滾動條的css？我的iframe中的當前滾動條的問題是框架不是很寬，滾動條看起來很笨重，佔用太多空間...使用"scrolling="no"使滾動條消失，但用戶無法滾動......順便說一下，我的瀏覽器是谷歌瀏覽器...Iframe Scrollbar css
A
回答
0
這是改變iframe中滾動條的鍍鉻
body {
position: absolute;
overflow-y: scroll;
overflow-x: hidden;
}
html {
overflow-y: auto;
background-color: transparent;
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
display: none;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
height: 30px;
background-color: transparent;
}
::-webkit-scrollbar-track-piece {
background-color: #3b3b3b;
-webkit-border-radius: 16px;
}
::-webkit-scrollbar-thumb:vertical {
height: 50px;
background-color: #666;
border: 1px solid #eee;
-webkit-border-radius: 6px;
}
0
你不能用CSS設計一個滾動條（然後打開和關閉）。
有一些專有的東西，可以讓你應用一些樣式，但只有IE和Opera支持。
Chrome沒有提供這樣做的機制。
作爲評論者指出，WebKit現在支持a different proprietary mechanism for styling scrollbars。我不知道WebKit的Chrome版本是否已經合併或啓用。
你可能看看用JavaScript取代滾動條批發，而jScrollPane似乎做了一個合理的工作，不打破常規的交互規則。
這就是說，改變用戶控件的外觀是我會盡量避免，並且使一些用戶需要在小套瞄準一個指針從閃爍的紅燈標示「Fitts's law」。
更好的解決方案可能是「不把太多的信息塞進這麼小的空間」。
0
您可以通過獲取滾動元件的框架，例如使用jQuery使它：
$("#iFrameId").contents().find("-webkit-scrollbar").css("width","5px")
但正如有人說 - 它不是一個漂亮的解決方案。
+0
我在哪裏放置？ – David 2010-08-24 19:06:29
+0
在'
多數民衆贊成在CSS並非完全如此：http://ajaxian.com/archives/webkit-now-lets-you-style-scrollbars – 2010-08-24 18:57:16
莫非我做一個div而不是iframe並且設計div滾動條？ – David 2010-08-24 18:57:31
@ŁukaszW.pl - Nighhhhhh！ – Quentin 2010-08-24 18:59:26