Czy istnieje sposób przełączania lewych i prawych wartości css w języku od prawej do lewej?

Question

Pracuję na stronie, która obsługuje wiele różnych ustawień regionalnych. Nasza następna lokalizacja to język hebrajski, który jest językiem pisanym od prawej do lewej. Ustawiam dir=rtl i lang=he na elemencie HTML, a niektóre rzeczy zmieniają się (tak jak powinny).

Duża część witryny wykorzystuje elementy z pozycjonowaniem bezwzględnym, ustawiając lewą wartość. Czy istnieje sposób, aby to zrobić, gdy jesteś w trybie rtl, który przełączy go na odpowiednią wartość?

Wiem, że mogę mieć klasę rtl na moim elemencie html i nadpisuję css, gdy ta klasa jest obecna, ale projekt jest dość duży i nie byłoby fajnie ścigać wszystkie te wystąpienia ręcznie.

Answer 1

Wydaje mi się, że dodawanie klas byłoby bardziej niezawodne, ale biorąc pod uwagę, ile by to nie było zabawy, zapoluj je za pomocą JavaScript!

Codepen

$(document).ready(function() { 
    var elsToFlip = $('*') 
    elsToFlip.each(function() { 
    var pos = $(this).css('position') 
     , left = $(this).css('left') 

    if (pos === 'absolute' && left !== 'auto') { 
     $(this).css({ 
     left: 'initial' 
     , right: left 
     }) 
    } 
    }) 
})