add RTL support

FezVrasta · 7e710ac11d23710e63e2ff2208e812ec919bfa8c · vmtco committed Sep 10, 2016 · Sep 10, 2016 · 7e710ac
1 parent 1a37034
commit 7e710ac11d23710e63e2ff2208e812ec919bfa8c
Unified Split

Showing with 29 additions and 2 deletions.

+27 −0 jquery.dropdown.css

+2 −2 jquery.dropdown.js
diff --git a/jquery.dropdown.css b/jquery.dropdown.css
@@ -95,3 +95,30 @@ select[data-dropdownjs][disabled] + .dropdownjs > input[readonly] {
 .dropdownjs > ul > li:h > .close:hover:before {
   opacity: .9;
 }
+
+.rtl .dropdownjs > input{
+	padding-right: 0;
+	padding-left: 30px;
+}
+
+.rtl .dropdownjs > ul[placement=top-right] {
+  -webkit-transform-origin: bottom right;
+      -ms-transform-origin: bottom right;
+          transform-origin: bottom right;
+  bottom: 0;
+  left: auto;
+  right: 0;
+}
+.rtl .dropdownjs > ul[placement=bottom-right] {
+  -webkit-transform-origin: top right;
+      -ms-transform-origin: top right;
+          transform-origin: top right;
+  top: 0;
+  left: auto;
+  right: 0;
+}
+.rtl .dropdownjs > ul > li > .close:before {
+  right: auto;
+  left: 15px;
+  float: left;
+}
diff --git a/jquery.dropdown.js b/jquery.dropdown.js
@@ -236,9 +236,9 @@
           // Decide if place the dropdown below or above the input
           if (height < 200 && coords.top > coords.bottom) {
             height = coords.top;
-            $ul.attr("placement", "top-left");
+            $ul.attr("placement", $("body").hasClass("rtl") ? "top-right" : "top-left");
           } else {
-            $ul.attr("placement", "bottom-left");
+            $ul.attr("placement", $("body").hasClass("rtl") ? "bottom-right" : "bottom-left");
           }
 
           $(this).next("ul").css("max-height", height - 20);