当前位置：文江博客话题详情

如何隐藏滚动条（溢出：隐藏）？

发布于 2024-11-25 21:40:54 字数 568 浏览 0 评论 0原文

我有可滚动页面，其中包含打开厚盒的链接。

（参见示例landme.ru/scroll-bug/）

我想在打开thickbox时隐藏垂直滚动并停留在页面底部。将“overflow:hidden”属性应用于“body”标签不会在ie7下工作。如果我将此属性用于“html”标记，则页面内容为在滚动之前向上滚动将被隐藏

抱歉我的英语

UPD：同时我使用这样的代码：

css：
.noscroll{overflow:hidden;}

js：

if ( ($.browser.msie) && ($.browser.version == '7.0')) {  
   $('html').addClass('noscroll');  
} else {  
   $('body').addClass('noscroll');  
}

它有效，但我仍然想知道是否还有其他方法

原文

I have scrollable page with link which opens thickbox.

(see example landme.ru/scroll-bug/)

I want to hide vertical scroll when thickbox is opened and stay on the bottom of the page.
Applying 'overflow:hidden' property to 'body' tag does not
work in ie7. If I use this property for 'html' tag, the page content is
scrolled up before scroll will be hidden

sorry for my english

UPD: Meanwhile I use such code:

css:
.noscroll{overflow:hidden;}

js:

if ( ($.browser.msie) && ($.browser.version == '7.0')) {  
   $('html').addClass('noscroll');  
} else {  
   $('body').addClass('noscroll');  
}

It works, but I still want to know, if there are any other methods

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

缺⑴份安定 2024-12-02 21:40:54

好吧，问题出在高度上。您不能只指定隐藏在换行上的溢出，因为它不知道在哪里停止。将“wrap”包裹在div中，样式属性为position:relative；高度：100%；然后给换行样式为overflow:hidden;高度：100%；位置：绝对；

最后，您需要滚动它，使其位于底部。

document.getElementsByClassName("wrap")[0].scrollTop = document.getElementsByClassName("wrap")[0].scrollHeight

就这样了:)

测试用例在这里：
http://jsbin.com/eguhuj#html

有一点滚动条，但那是因为jsbin 的。在一个 html 文档中它看起来很完美。

编辑：更新的代码...我们可以先测试一下它是否有效...您可以将其放入锚元素中吗？

onclick="(function(){var blah = document.getElementsByClassName("wrap")[0];
document.getElementsByClassName("wr")[0].style.position = "absolute";
var meh = document.body.scrollTop;
blah.style.overflow = "hidden";
blah.style.height = "100%";
blah.style.position = "absolute";
blah.scrollTop = meh;})();"

ok so the problem is with the height. You can't just specify overflow hidden on the wrap because it has no idea where to stop. Wrap the "wrap" in a div with the style attributes of position:relative; height:100%; then give the wrap the style of overflow: hidden; height: 100%; position: absolute;

lastly you need to scroll it so it's at the bottom.

document.getElementsByClassName("wrap")[0].scrollTop = document.getElementsByClassName("wrap")[0].scrollHeight

and there you have it :)

test case here:
http://jsbin.com/eguhuj#html

there is a tiny bit of scroll bar, but that's because of jsbin. in just an html document it looks perfect.

EDIT: updateed code... can we test this to see if it works first... can you put this in your anchor element?

onclick="(function(){var blah = document.getElementsByClassName("wrap")[0];
document.getElementsByClassName("wr")[0].style.position = "absolute";
var meh = document.body.scrollTop;
blah.style.overflow = "hidden";
blah.style.height = "100%";
blah.style.position = "absolute";
blah.scrollTop = meh;})();"

回复收藏 0 原文

~没有更多了~