我想让div
可以在ipad上滚动,但我不希望在桌面浏览器上看到滚动条,是否可能? overflow-x:滚动,但滚动条是不可见的?保留滚动功能但删除滚动条。
或者是否可以使用div
来覆盖滚动条?
答案 0 :(得分:0)
您获得滚动条的宽度:
var scrollwdth = document.getElementById("scrolldiv").clientWidth;
然后将textarea插入到另一个充当框架的div中,并将其设置为:
document.getElementById("frame").style.width = scrollwdth + "px";
html是这样的:
<div id="frame">
<div id="scrolldiv"></div>
</div>
而且,非常重要的是,“框架”包含overflow-y:hidden;
,因此滚动条不可见。
答案 1 :(得分:0)
请检查提琴手代码 here 。
使用以下代码获取滚动条宽度(从here重新标记)
function getScrollBarSize () {
var inner = document.createElement('p');
inner.style.width = "100%";
inner.style.height = "100%";
var outer = document.createElement('div');
outer.style.position = "absolute";
outer.style.top = "0px";
outer.style.left = "0px";
outer.style.visibility = "hidden";
outer.style.width = "100px";
outer.style.height = "100px";
outer.style.overflow = "hidden";
outer.appendChild (inner);
document.body.appendChild (outer);
var w1 = inner.offsetWidth;
var h1 = inner.offsetHeight;
outer.style.overflow = 'scroll';
var w2 = inner.offsetWidth;
var h2 = inner.offsetHeight;
if (w1 == w2) w2 = outer.clientWidth;
if (h1 == h2) h2 = outer.clientHeight;
document.body.removeChild (outer);
return [(w1 - w2),(h1 - h2)];
};
将宽度设置为内部div,如下所示:
$(document).ready(function() {
$(".innerDiv").width($(".outerDiv").width() + getScrollBarSize()[0]);
});
还有一个链接可以实现以jquery和非jquery方式计算滚动条的宽度和高度。