【问题标题】:Enable mouse scrollbar and fix vertical scrollbar in Codemirror 3.23 when direction is changed to rtlCodemirror 3.23 在方向更改为 rtl 时启用鼠标滚动条并修复垂直滚动条
【发布时间】:2016-02-11 06:18:26
【问题描述】:
我想根据语言更改文本方向。当它是 LTR 时一切正常,但一旦切换到 RTL,codemirror 的 textarea 中就会出现两个垂直滚动条。当我删除溢出-y:滚动时,我的鼠标滚动停止工作并且改变方向不会添加新的垂直滚动条。
我想修复右侧的垂直滚动条和左侧的行号,而不管鼠标滚动条工作的文本方向如何。
【问题讨论】:
标签:
javascript
jquery
css
【解决方案1】:
从 CodeMirror-vscrollbar 类中移除 Top 和 Right 属性如下:
.CodeMirror-vscrollbar {
overflow-x: hidden;
overflow-y: scroll;
}
.CodeMirror-hscrollbar {
bottom: 0; left: 0;
overflow-y: hidden;
overflow-x: scroll;
}
在 Codemirror.css 中创建另一个具有以下名称的类:
.ltrAlign{
right: 0; top: 0;
}
.rtlAlign{
left: 0; top: 0;
}
然后在你使用的jsp或php页面中添加以下代码:
从左到右:
$(".CodeMirror-vscrollbar").removeClass('rtlAlign');
$(".CodeMirror-vscrollbar").addClass('ltrAlign');
从右到左:
$(".CodeMirror-vscrollbar").addClass('rtlAlign');
$(".CodeMirror-vscrollbar").removeClass('ltrAlign');