如果没有必要,隐藏滚动条 - Ace编辑器

时间:2014-10-06 06:17:21

标签: javascript ace-editor

我一直在试验Ace Editor,而且我一直试图自动隐藏" (=不使用系统默认值)垂直/水平滚动条,不使用时。

有办法吗?有什么想法吗?

2 个答案:

答案 0 :(得分:4)

只需将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;
}

EDIT2:

隐藏滚动条如果编辑器没有悬停:

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;
}

答案 1 :(得分:2)

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

editor.getSession()。setUseWrapMode(真)