Obsługa języków Flexslider i Right-To-Left

Question

Zainstalowałem szablon na WordPress zawierający Flexslider. Mój język jest pisany od prawej do lewej (RTL). Gdy strona jest RTL, Flexslider zatrzymuje się i nie pojawiają się żadne obrazy. Jak mogę rozwiązać ten problem?

Answer 1

Suwak flex nie obsługuje języków rtl. Jedynym sposobem, aby to naprawić jest, aby div trzyma suwak direction: ltr

1. Na temat, czy suwak na stronie głównej znaleźć plik o nazwie index.php znaleźć div, który trzyma suwak i to wszystko Kod style="direction:ltr;" ten pokaże swoje artykuły na slier doskonale

2. Aby ustalić kierunek tekstu z RTL znaleźć plik o nazwie flexslider.css na temat i na linii trzymając kod .flexslider .slides > li{ (linia nr 25 dla mnie) to dodatek :
   text-align:right;
direction:rtl;

Te kroki holowania naprawiono dla mnie. Powodzenia

Answer 2

Odpowiedź fatmy nie działa dla mnie. Co działa jest modyfikowanie .flex-viewport ustawiając direction: ltr:

.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; direction: ltr; } 

Answer 3

Aby rozwiązać kierunkową nawigację, te zasady w swoim arkuszu stylów powinny przesłonić zasady flexslider:

/* Flexslider RTL */ 
.flex-direction-nav .flex-next {background-position: 0 0; left: -36px; right: auto;} 
.flex-direction-nav .flex-prev {background-position: 100% 0; right: -36px; left: auto;} 
.flexslider:hover .flex-next {left: 5px; right: auto;} 
.flexslider:hover .flex-prev {right: 5px; left: auto;} 
@media screen and (max-width: 860px) { 
    .flex-direction-nav .flex-prev {opacity: 1; right: 0; left: auto;} 
    .flex-direction-nav .flex-next {opacity: 1; left: 0; right: auto;} 
} 

Answer 4

trzeba zmienić zarówno JS i CSS dla niego pracować. Na szczęście nie wymagało to wiele pracy. Rozwidlałem projekt i dodałem wsparcie pod adresem https://github.com/layalk/FlexSlider/tree/rtl. Spróbuj.

Answer 5

Użyłem funkcji reverse:true, w flexslider() i suwak pracował w przeciwnym kierunku niż domyślny.

I

.flexslider .slides li{ 
    direction: ltr; 
} 

on pracował dla mnie.