隐藏溢出但没有滚动条的可滚动区域答案

【问题标题】：A scrollable area with the overflow hidden but no scroll bar隐藏溢出但没有滚动条的可滚动区域
【发布时间】：2010-09-22 06:54:16
【问题描述】：

有没有办法让溢出的 div 隐藏溢出，没有滚动条但仍可滚动（通过鼠标滚轮/触摸输入）？

例如

<!DOCTYPE html>  
    <div id="longtext" style="width:100px; height:100px;">  
        Lorem ipsum....  
    </div>

我的 CSS 尝试失败了，因为 overflow: hidden; 停止了可滚动区域，而 overflow: auto/overflow: scroll 有滚动条。

提前致谢

【问题讨论】：

如果没有滚动条，用户如何知道<div> 可以用鼠标滚轮滚动？
进一步@BoltClock 的独角兽（+1）评论：请不要。我喜欢我一贯的 UI 功能。当它们被打破时，它会令人沮丧。
我同意这将是一件好事很少见，我只是惊讶地发现这是不可能的。为了安抚所有相关方，我对相关页面进行了全面检查，因此不再是问题。感谢您的意见，我没想到一个技术问题会得到一个美学答案，但正确的答案就是正确的答案！

标签： html css scroll scrollbar overflow

【解决方案1】：

你正在做的是告诉浏览器内容是可滚动的，但同时试图告诉它不要表现得好像它是可滚动的。我不确定这是一个明智的想法。

我能找到的最接近的想法是依赖于 IE 的方法，使用您自己的配色方案设置滚动条的样式：

#div { 边距：0 0 0 0；填充：0 0 0 0；滚动条面颜色：#666666；滚动条高亮颜色：#333333；滚动条阴影颜色：#222222；滚动条-3dlight-color：#888888；滚动条箭头颜色：#ff0000；滚动条轨道颜色：#222222；滚动条暗影颜色：#111111 }

如果您要更改颜色以匹配您的 div 的背景，这可能是一个想法。但是，请务必注意，这是一种仅限 IE 的行为。

【讨论】：

我已将此标记为正确答案，因为我一开始就确信这是一个坏主意。感谢@BoltClock 也是独角兽。
干杯。很好地找到了返工页面并避免问题的方法。
Flixster chrome 应用程序（在 Chrome 商店中）在侧边栏中执行此操作。我还没有弄清楚他们是如何做到的。此外，Chrome 中的 Tweetdeck 应用程序的每一列都有一个可滚动区域 - 并且这些列不使用真正的滚动条（我认为它们区域被自定义控件替换）