如何显示overflow：hidden 的被隐藏的内容_html/css

如何显示overflow：hidden 的被隐藏的内容_html/css_WEB-ITnose

php中文网

发布： 2016-06-24 12:04:59

原创

4252人浏览过

1、在css 里 html设置了overflow：hidden 滚动条被隐藏，在chrome中可以用鼠标滚轮滚动内容，但是在ie里（我用的ie10）鼠标滚轮无效，只能把内容选中然后往下拖。这个问题该如何解决呢？

2、在页面内，有一个div，里面的内容也需要隐藏，我在div里设置overflow：hidden ；内容隐藏了，但是拖动不了内容，被隐藏的内容我查看不了，这个问题又该如何解决呢？

跪求帮忙！谢谢大家！

回复讨论(解决方案)

想要可以滚就用 overflow:scroll; 嫌这个scroll难看就自己写个

<!DOCTYPE html><html><head><title></title><style type="text/css">* {margin: 0;padding: 0;}body {background-color: #fff;}.container {height: 500px;border: 1px solid #222;background: #eee;overflow: hidden;}p {margin: 50px;border: 1px solid #ddd;}</style></head><body><div class="container">	<p>qwe	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br /></p></div></body></html>

登录后复制

关于第一条貌似chrome也不能滚动吧.

想要可以滚就用 overflow:scroll; 嫌这个scroll难看就自己写个

现在需求是不要滚动条

<!DOCTYPE html><html><head><title></title><style type="text/css">* {margin: 0;padding: 0;}body {background-color: #fff;}.container {height: 500px;border: 1px solid #222;background: #eee;overflow: hidden;}p {margin: 50px;border: 1px solid #ddd;}</style></head><body><div class="container">	<p>qwe	1234213<br />		1234213<br />	</p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/ai/2140">
                            <img src="https://img.php.cn/upload/ai_manual/000/000/000/175680088878918.png" alt="芦笋演示">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/ai/2140">芦笋演示</a>
                            <p>一键出成片的录屏演示软件，专为制作产品演示、教学课程和使用教程而设计。</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="芦笋演示">
                                <span>34</span>
                            </div>
                        </div>
                        <a href="/ai/2140" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="芦笋演示">
                        </a>
                    </div>
                </div></body></html>

登录后复制

关于第一条貌似chrome也不能滚动吧.

大哥，你的我试过了，也不能滚动，直接隐藏了，css中html{ overflow:hidden}在chrome中是可以滚动的，只是在ie中只能选中，然后慢慢往下移。

其实这种设计没有必要的,最好是避免这样做法,一般是不会给html加overflow hidden的.

想要可以滚就用 overflow:scroll; 嫌这个scroll难看就自己写个

现在需求是不要滚动条

那就自己模拟滚动条啊 js 可以拖拽滚轮事件都能获取到的设置外层div overflow:hidden 控制内层div 的position(margin)
或者用上面的办法再外面再加个div 把滚动条遮住就完了