【问题标题】：Hide scrollbars, if not necessary - Ace editor如果不需要，隐藏滚动条 - Ace 编辑器
【发布时间】：2014-10-06 06:17:20
【问题描述】：

我一直在尝试使用 Ace Editor，并且一直在尝试在不使用时自动“隐藏”（= 不使用系统默认值）垂直/水平滚动条。

有办法吗？有什么想法吗？

【问题讨论】：

标签： javascript ace-editor

【解决方案1】：

只需将overflow:auto css 添加到正确的元素。我认为可能是.ace_scroller。给我举个滚动条的例子，或者自己使用 Object Inspector (Ctrl + Shift + I ; Chrome, FF, Opera) 找到。

编辑：

这是你的代码：

body .ace_scrollbar-v {
    overflow-y: auto;
}

body .ace_scrollbar-h {
    overflow-x: auto;
}

编辑2：

如果编辑器没有悬停，则隐藏滚动条：

body .ace_scrollbar {
    display: none;
}
body .ace_editor:hover .ace_scrollbar {
    display: block;
}

或者用动画：

body .ace_scrollbar {
    -webkit-transition: opacity .3s ease-in-out;
       -moz-transition: opacity .3s ease-in-out;
        -ms-transition: opacity .3s ease-in-out;
         -o-transition: opacity .3s ease-in-out;
            transition: opacity .3s ease-in-out;
    opacity: 0;
}
body .ace_editor:hover .ace_scrollbar {
    opacity: 1;
}

【讨论】：

好吧，我已经试过了（特别是你建议的.ace_scroller），问题是......在我试图“隐藏”的那个旁边添加了另一对滚动条。
找到合适的元素或提供带有滚动条的示例...我不是魔术师 ;)
我刚刚意识到它是如何工作的。再看答案。
嗯...仍然没有。滚动条还在。（仅供参考，测试仅在 Safari 上完成。我对任何其他浏览器不感兴趣）
如果文本很短，此答案将滚动条设置为隐藏，但这是 ace 中的默认行为，可以使用ace.setOptions({hScrollBarAlwaysVisible: false, vScrollBarAlwaysVisible: false}) 激活，问题似乎是关于在不像 mac os 上那样悬停时隐藏滚动条。

【解决方案2】：

您可能还想设置自动换行。

editor.getSession().setUseWrapMode(true)

【讨论】：