当方向更改为rtl时,启用鼠标滚动条并修复Codemirror 3.23中的垂直滚动条

时间:2016-02-11 06:18:27

标签: javascript jquery css css3

我想根据语言改变文字方向。当它是LTR时,一切正常,但是一旦切换到RTL,那么codemirror的textarea中就有两个垂直滚动条。当我删除overflow-y:scroll时,我的鼠标滚动停止工作,更改方向不会添加新的垂直滚动条。 我想在右侧修复垂直滚动条,在左侧修理亚麻布,无论文本方向如何,鼠标滚动条都能正常工作。

enter image description here

1 个答案:

答案 0 :(得分:2)

从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');