javascript - ng-滚动条 : Right to left issue when horizantal scrolling

Question

我们正在开发单页应用程序。它以两种语言呈现。一种是从右到左，另一种是从左到右。

对于滚动功能，我们使用 ng-scrollbars这是 malihu-custom-scrollbar-plugin 的 Angularjs 包装器.对于从左到右格式的语言，它可以正常工作，但问题在于从右到左的语言。

问题是当拖动水平滚动条时，内容会滚动到相反的方向。

下面是滚动条不滚动时的定位方式:

这是向左滚动和向右滚动时的样子。正如您所看到的，内容区域的右侧有一个巨大的空间:

我正在寻找可能遇到过类似问题的任何人的解决方案。提前致谢。

更新

我的 html 是:

<div class="block" ng-scrollbars>
    <!--My contents-->
</div>

我的CSS是:

*{
    direction:rtl;
 }

Plunker Reproducing Issue

Answer 1

问题出在我的 CSS 中。我已将所有元素的 direction css 属性设置为 rtl。

* {
   direction: rtl;
}

使用指令 ng-scrollbar 添加 dir 属性解决了这个问题。

<div class="block" ng-scrollbars dir="rtl">
   <!-- your content here -->
</div>

Plunker Demo