我有一个div与css overfow:hidden
。但我需要滚动这个div
。我GOOGLE了它,并找到解决办法是更改overflow:scroll
并隐藏滚动条。但在MacBook Pro中,我可以看到滚动条。有什么办法可以解决这个问题吗?有什么办法滚动div与溢出:隐藏
0
A
回答
1
请试试这个
<style type="text/css">
.inside { width: 500px; overflow: auto; height: 200px; padding-right: 20px; }
.outside { width: 500px; height: 300px; overflow: hidden; }
</style>
<div class="outside">
<div class="inside">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium enim blandit ligula pharetra pharetra. Curabitur posuere nibh at nibh tincidunt sed porta dui commodo. Suspendisse id vulputate magna. Cras non arcu ac lacus dignissim pretium. Aenean varius luctus ante, sed tincidunt neque euismod id. Sed aliquam dui eu purus dapibus venenatis. Praesent tortor sem, pretium in rhoncus eu, eleifend at lectus. Donec dignissim turpis et lectus interdum dignissim. Maecenas porttitor ante ut ligula tempus sit amet tincidunt arcu aliquam. Vivamus at velit massa. Nulla eget ligula sed dolor porta porta sit amet ac est. Vestibulum rhoncus tempus ligula quis vulputate. Nullam auctor, neque tristique ultrices iaculis, neque nisl semper est, id adipiscing ligula est eu diam.</p>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec enim ante, rhoncus at egestas eget, imperdiet vitae sem. Mauris sed massa elit, ac posuere nibh. Integer ut metus et felis blandit pellentesque id eget velit. Quisque vehicula consectetur nibh sit amet posuere. Etiam egestas lacus id justo fringilla sodales. Donec scelerisque aliquam urna sed sodales. Cras ornare neque fringilla nisl molestie venenatis. Quisque quis lacus ut augue sodales tristique non id sapien. Sed risus nisl, egestas eu sodales ut, rhoncus id nisl. Maecenas hendrerit tellus neque. Aliquam sodales gravida luctus. Suspendisse porta porta libero at venenatis. Proin laoreet accumsan ipsum, et ultrices nisi pharetra et. Nullam in dolor quam, et adipiscing ipsum. In consequat interdum sollicitudin. </p>
</div>
</div>
-1
1
尝试overflow: auto;
这将显示滚动条,如果它是需要的,即在div内容的高度比div的高度。否则,如果内容符合div的范围,它将不会显示滚动条。
2
Youtube通过在overflow-y: hidden; padding-right: 17px
和overflow-y: scroll; padding-right: 0;
到:hover
之间切换来解决此问题。
它使它看起来整洁,它让用户知道你可以滚动。考虑告诉你的用户,而不是假装他们知道。
相关问题
- 1. 带有Javascript的可滚动内容与溢出Div:隐藏
- 2. 滚动时隐藏溢出
- 3. 限制DIV高度与溢出:通过家长滚动使用溢出:隐藏
- 4. Css转换无法在滚动div的身体溢出:隐藏
- 5. 动画滚动div与溢出滚动
- 6. 溢出隐藏自动滚动
- 7. Jquery - 滚动DIV(溢出:自动;)与DIV
- 8. jQuery可拖动div使溢出:隐藏页面滚动
- 9. 折叠的div与溢出隐藏
- 10. 溢出隐藏和滚动同时
- 11. jQuery滚动UL隐藏溢出
- 12. Blueprintjs表隐藏溢出-s滚动条
- 13. 制作溢出:隐藏不滚动
- 14. 溢出虚假滚动条:隐藏
- 15. 集溢出隐藏只有父div
- 16. 悬停图像滚动div(溢出:隐藏)
- 17. textarea滚动条溢出并隐藏div边框
- 18. 与clearfix混合溢出div容器溢出︰隐藏
- 19. jQuery Sortable - 滚动div与溢出:自动
- 20. ,同时隐藏滚动条和隐藏溢出触发事件
- 21. 有没有办法隐藏垂直溢出的表格?
- 22. MixItUp动画与“溢出:隐藏”父
- 23. 隐藏的WebKit滚动条时溢出滚动:触摸启用
- 24. jquery的窗口滚动事件不与溢出 - X隐藏
- 25. CSS溢出:隐藏或滚动不与跨度工作
- 26. 隐藏与AngularJS滚动的div
- 27. 图像没有溢出隐藏:隐藏
- 28. 溢出隐藏隐藏所有内容
- 29. 下拉菜单隐藏时,把内部div与溢出自动
- 30. 隐藏溢出