Fix leongersen#987 - noUi-origin extends beyond slider

Could not do this originally, but https://bugs.chromium.org/p/chromium/issues/detail?id=798223 seems fixed.
santagarwal · Jun 20, 2019 · 809eb82 · 809eb82
1 parent 0b860ea
commit 809eb82
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 4 deletions.
diff --git a/src/nouislider.core.less b/src/nouislider.core.less
@@ -40,14 +40,21 @@
 	z-index: 1;
 	top: 0;
 	left: 0;
-	height: 100%;
-	width: 100%;
 	-ms-transform-origin: 0 0;
 	-webkit-transform-origin: 0 0;
 	-webkit-transform-style: preserve-3d;
 	transform-origin: 0 0;
 	transform-style: flat;
 }
+.@{noUi-css-prefix}-connect {
+	height: 100%;
+	width: 100%;
+}
+.@{noUi-css-prefix}-origin {
+	height: 1%;
+	width: 1%;
+}
+
 /* Offset direction
  */
 html:not([dir="rtl"]) .@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-origin {

diff --git a/src/nouislider.js b/src/nouislider.js
@@ -2092,8 +2092,10 @@
             // Convert the value to the slider stepping/range.
             scope_Values[handleNumber] = scope_Spectrum.fromStepping(to);
 
-            var rule = "translate(" + inRuleOrder(transformDirection(to, 0) - scope_DirOffset + "%", "0") + ")";
-            scope_Handles[handleNumber].style[options.transformRule] = rule;
+            var translation = 100 * (transformDirection(to, 0) - scope_DirOffset);
+            var translateRule = "translate(" + inRuleOrder(translation + "%", "0") + ")";
+
+            scope_Handles[handleNumber].style[options.transformRule] = translateRule;
 
             updateConnect(handleNumber);
             updateConnect(handleNumber + 1);