Мы работаем над одностраничным приложением. Он отображается на двух языках. Один справа налево, а другой слева направо.
Для функциональности прокрутки мы используем ng-scrollbars, которая является оберткой Angularjs для malihu-custom-scrollbar-plugin. Для языков с левым и правым форматом он работает правильно, но проблема заключается в праве на левые языки.
Проблема заключается в том, что горизонтальная полоса прокрутки перемещается таким образом, что содержимое прокручивается в противоположном направлении.
Ниже показано, как полоса прокрутки позиционируется при отсутствии прокрутки:
И вот как это выглядит при прокрутке влево и назад вправо. Как вы видите, в правой части области содержимого есть огромное пространство:
Я ищу решение от любого, кто мог столкнуться с подобной проблемой. Заранее спасибо.
Мой html:
<div class="block" ng-scrollbars>
<!--My contents-->
</div>
Мой css:
*{
direction:rtl;
}
Проблема была в моем css. Я установил свойство css direction
для rtl
для всех элементов.
* {
direction: rtl;
}
С директивой ng-scrollbar
добавление свойства dir
решило проблему.
<div class="block" ng-scrollbars dir="rtl">
<!-- your content here -->
</div>