diff --git a/apps/common/main/lib/component/MultiSliderGradient.js b/apps/common/main/lib/component/MultiSliderGradient.js
index 8986fdfa7..24dc97504 100644
--- a/apps/common/main/lib/component/MultiSliderGradient.js
+++ b/apps/common/main/lib/component/MultiSliderGradient.js
@@ -56,6 +56,7 @@ define([
             colorValues: ['#000000', '#ffffff'],
             currentThumb: 0,
             includeSnap: true,
+            intervalSnap: 5,
             thumbTemplate: '<div class="thumb" style="">' +
                             '<div class="thumb-top"><div class="thumb-top-inner"></div></div>' +
                             '<div class="thumb-bottom"><div class="thumb-bottom-inner"></div></div>' +
diff --git a/apps/common/main/lib/component/Slider.js b/apps/common/main/lib/component/Slider.js
index a722b8c2c..05ad8c0c0 100644
--- a/apps/common/main/lib/component/Slider.js
+++ b/apps/common/main/lib/component/Slider.js
@@ -286,6 +286,7 @@ define([
             maxValue: 100,
             values: [0, 100],
             includeSnap: false,
+            intervalSnap: undefined,
             thumbTemplate: '<div class="thumb" style=""></div>'
         },
 
@@ -314,6 +315,7 @@ define([
             me.maxValue = me.options.maxValue;
             me.delta = 100/(me.maxValue - me.minValue);
             me.includeSnap = me.options.includeSnap;
+            me.intervalSnap = me.options.intervalSnap;
             me.thumbs = [];
             if (me.options.el) {
                 me.render();
@@ -364,7 +366,7 @@ define([
             var resetPageX =  function (e) {
                 if(!me.includeSnap) return;
                 _.each(me.centers, function (x) {
-                    if((e.pageX <= x + 10) && (e.pageX >= x - 10)) {
+                    if((e.pageX <= x + me.intervalSnap) && (e.pageX >= x - me.intervalSnap)) {
                         e.pageX = x;
                         return;
                     }