I am developing a mobile application using jQuery and was looking for a solution for RTL languages support for jQuery Mobile. Unfortunately I found none. I had to do it my self. Please keep in mind that the file might not be complete, I have gradually updated it so that my application works. You might be using more components that needs further changes.
You can download the file from here
In case you still had any issues, the tips below helps you to fix the situation, I hope J.
- Add a direction attribute with “rtl” value to the body CSS
- Overwrite all css classes that has “float:right” with “float:left” and vise versa
- Overwrite all css classes that has “left:” with “right:” and vise versa. It is worth mentioning her that you keep the previous attribute and make it auto. Else it won’t work.
i.e. left:15px should be overwrite with left:auto;right:15px.
- Do the same as point 3 for all classes that has margin-left, margin-right, padding-left and padding-right
That’s it, please enjoy it and let me know if you’ve any comments or questions
UPDATE: I stumbled upon another version for achieving this. I believe it’s more comprehensive than mine J. Please check http://stackoverflow.com/questions/6321271/jquery-mobile-right-to-left-css