diff --git a/README.md b/README.md
index c5979e8..ae4203f 100644
--- a/README.md
+++ b/README.md
@@ -272,6 +272,61 @@ The ColorPicker function has recognized only two arguments which means that it b
 and also fixes and positions indicators automatically.
 
 
+Pointer Events
+========
+If you require more widely support with mobile or touch device, you should add `touch-action="none"` to css like:
+```css
+<!-- basic -->
+    #picker { width: 200px; height: 200px; touch-action: none; }
+    #slider { width: 30px; height: 200px; touch-action: none; }
+
+<!-- advanced -->
+    #picker-wrapper {
+        width: 200px;
+        height: 200px;
+        position: relative;
+        touch-action: none;
+    }
+    #slider-wrapper {
+        width: 30px;
+        height: 200px;
+        position: relative;
+        touch-action: none;
+    }
+```
+
+if you require [Pointer Events Polyfill](https://github.com/jquery/PEP) and don't want to use [**No hassle**](#no-hassle) method, according to [Polyfill limitations](https://github.com/jquery/PEP#polyfill-limitations), please add `touch-action="none"` attribute to element like:
+```html
+<!-- basic method -->
+    <div id="picker" touch-action="none"></div>
+    <div id="slider" touch-action="none"></div>
+
+<!-- advanced method -->
+    <div id="picker-wrapper">
+        <div id="picker" touch-action="none"></div>
+        <div id="picker-indicator"></div>
+    </div>
+    <div id="slider-wrapper">
+        <div id="slider" touch-action="none"></div>
+        <div id="slider-indicator"></div>
+    </div>
+```
+Recommend to place in a big wrapper and set `touch-action="none"`, to prevent to fire default event like page scroll. 
+```html
+    <div id="colorpicker" touch-action="none">
+        <div id="picker-wrapper">
+            <div id="picker" touch-action="none"></div>
+            <div id="picker-indicator"></div>
+        </div>
+        <div id="slider-wrapper">
+            <div id="slider" touch-action="none"></div>
+            <div id="slider-indicator"></div>
+        </div>
+    </div>
+```
+
+
+
 License
 ========
 
diff --git a/colorpicker.js b/colorpicker.js
index e13892c..ff67ef8 100644
--- a/colorpicker.js
+++ b/colorpicker.js
@@ -13,11 +13,11 @@
     var colorpickerHTMLSnippet = [
         
         '<div class="picker-wrapper">',
-                '<div class="picker"></div>',
+                '<div class="picker" touch-action="none"></div>',
                 '<div class="picker-indicator"></div>',
         '</div>',
         '<div class="slide-wrapper">',
-                '<div class="slide"></div>',
+                '<div class="slide" touch-action="none"></div>',
                 '<div class="slide-indicator"></div>',
         '</div>'
         
@@ -35,8 +35,13 @@
         if (evt.offsetX !== undefined && evt.offsetY !== undefined) {
             return { x: evt.offsetX, y: evt.offsetY };
         }
-        // Firefox:
         var wrapper = evt.target.parentNode.parentNode;
+        // PEP fix
+        if (typeof evt.offsetX === 'undefined') {
+            wrapper = wrapper.getBoundingClientRect();
+            return { x: evt.pageX - wrapper.x, y: evt.pageY - wrapper.y};
+        }
+        // Firefox:
         return { x: evt.layerX - wrapper.offsetLeft, y: evt.layerY - wrapper.offsetTop };
     }
 
@@ -187,6 +192,8 @@
         return function(evt) {
             evt = evt || window.event;
             var mouse = mousePosition(evt);
+            mouse.y = mouse.y > slideElement.clientHeight ? slideElement.clientHeight : mouse.y;
+            mouse.y = mouse.y < 0 ? 0 : mouse.y;
             ctx.h = mouse.y / slideElement.offsetHeight * 360 + hueOffset;
             var pickerColor = hsv2rgb({ h: ctx.h, s: 1, v: 1 });
             var c = hsv2rgb({ h: ctx.h, s: ctx.s, v: ctx.v });
@@ -206,6 +213,11 @@
                 width = pickerElement.offsetWidth,            
                 height = pickerElement.offsetHeight;
 
+            mouse.x = mouse.x > pickerElement.clientWidth ? pickerElement.clientWidth : mouse.x;
+            mouse.x = mouse.x < 0 ? 0 : mouse.x;
+            mouse.y = mouse.y > pickerElement.clientHeight ? pickerElement.clientHeight : mouse.y;
+            mouse.y = mouse.y < 0 ? 0 : mouse.y;
+
             ctx.s = mouse.x / width;
             ctx.v = (height - mouse.y) / height;
             var c = hsv2rgb(ctx);
@@ -320,16 +332,26 @@
         
         var mousedown = false;
 
-        addEventListener(element, 'mousedown', function(evt) { mousedown = true;  });
-        addEventListener(element, 'mouseup',   function(evt) { mousedown = false;  });
-        addEventListener(element, 'mouseout',  function(evt) { mousedown = false;  });
-        addEventListener(element, 'mousemove', function(evt) {
+        if (window.PointerEvent) {
+            addEventListener(element, 'pointerdown', function(evt) { mousedown = true;  });
+            addEventListener(element, 'pointerup',   function(evt) { mousedown = false;  });
+            addEventListener(element, 'pointerout',  function(evt) { mousedown = false;  });
+            addEventListener(element, 'pointermove', function(evt) {
+                if (mousedown) {
+                    listener(evt);
+                }
+            });
 
-            if (mousedown) {
-                
-                listener(evt);
-            }
-        });
+        } else {
+            addEventListener(element, 'mousedown', function(evt) { mousedown = true;  });
+            addEventListener(element, 'mouseup',   function(evt) { mousedown = false;  });
+            addEventListener(element, 'mouseout',  function(evt) { mousedown = false;  });
+            addEventListener(element, 'mousemove', function(evt) {
+                if (mousedown) {
+                    listener(evt);
+                }
+            });
+        }
     }
 
 
diff --git a/colorpicker.min.js b/colorpicker.min.js
index cce312e..ae7e3a5 100644
--- a/colorpicker.min.js
+++ b/colorpicker.min.js
@@ -1 +1 @@
-(function(s,t,u){var v=(s.SVGAngle||t.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1")?"SVG":"VML"),picker,slide,hueOffset=15,svgNS='http://www.w3.org/2000/svg';var w=['<div class="picker-wrapper">','<div class="picker"></div>','<div class="picker-indicator"></div>','</div>','<div class="slide-wrapper">','<div class="slide"></div>','<div class="slide-indicator"></div>','</div>'].join('');function mousePosition(a){if(s.event&&s.event.contentOverflow!==u){return{x:s.event.offsetX,y:s.event.offsetY}}if(a.offsetX!==u&&a.offsetY!==u){return{x:a.offsetX,y:a.offsetY}}var b=a.target.parentNode.parentNode;return{x:a.layerX-b.offsetLeft,y:a.layerY-b.offsetTop}}function $(a,b,c){a=t.createElementNS(svgNS,a);for(var d in b)a.setAttribute(d,b[d]);if(Object.prototype.toString.call(c)!='[object Array]')c=[c];var i=0,len=(c[0]&&c.length)||0;for(;i<len;i++)a.appendChild(c[i]);return a}if(v=='SVG'){slide=$('svg',{xmlns:'http://www.w3.org/2000/svg',version:'1.1',width:'100%',height:'100%'},[$('defs',{},$('linearGradient',{id:'gradient-hsv',x1:'0%',y1:'100%',x2:'0%',y2:'0%'},[$('stop',{offset:'0%','stop-color':'#FF0000','stop-opacity':'1'}),$('stop',{offset:'13%','stop-color':'#FF00FF','stop-opacity':'1'}),$('stop',{offset:'25%','stop-color':'#8000FF','stop-opacity':'1'}),$('stop',{offset:'38%','stop-color':'#0040FF','stop-opacity':'1'}),$('stop',{offset:'50%','stop-color':'#00FFFF','stop-opacity':'1'}),$('stop',{offset:'63%','stop-color':'#00FF40','stop-opacity':'1'}),$('stop',{offset:'75%','stop-color':'#0BED00','stop-opacity':'1'}),$('stop',{offset:'88%','stop-color':'#FFFF00','stop-opacity':'1'}),$('stop',{offset:'100%','stop-color':'#FF0000','stop-opacity':'1'})])),$('rect',{x:'0',y:'0',width:'100%',height:'100%',fill:'url(#gradient-hsv)'})]);picker=$('svg',{xmlns:'http://www.w3.org/2000/svg',version:'1.1',width:'100%',height:'100%'},[$('defs',{},[$('linearGradient',{id:'gradient-black',x1:'0%',y1:'100%',x2:'0%',y2:'0%'},[$('stop',{offset:'0%','stop-color':'#000000','stop-opacity':'1'}),$('stop',{offset:'100%','stop-color':'#CC9A81','stop-opacity':'0'})]),$('linearGradient',{id:'gradient-white',x1:'0%',y1:'100%',x2:'100%',y2:'100%'},[$('stop',{offset:'0%','stop-color':'#FFFFFF','stop-opacity':'1'}),$('stop',{offset:'100%','stop-color':'#CC9A81','stop-opacity':'0'})])]),$('rect',{x:'0',y:'0',width:'100%',height:'100%',fill:'url(#gradient-white)'}),$('rect',{x:'0',y:'0',width:'100%',height:'100%',fill:'url(#gradient-black)'})])}else if(v=='VML'){slide=['<DIV style="position: relative; width: 100%; height: 100%">','<v:rect style="position: absolute; top: 0; left: 0; width: 100%; height: 100%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="0" color="red" color2="red" colors="8519f fuchsia;.25 #8000ff;24903f #0040ff;.5 aqua;41287f #00ff40;.75 #0bed00;57671f yellow"></v:fill>','</v:rect>','</DIV>'].join('');picker=['<DIV style="position: relative; width: 100%; height: 100%">','<v:rect style="position: absolute; left: -1px; top: -1px; width: 101%; height: 101%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="270" color="#FFFFFF" opacity="100%" color2="#CC9A81" o:opacity2="0%"></v:fill>','</v:rect>','<v:rect style="position: absolute; left: 0px; top: 0px; width: 100%; height: 101%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="0" color="#000000" opacity="100%" color2="#CC9A81" o:opacity2="0%"></v:fill>','</v:rect>','</DIV>'].join('');if(!t.namespaces['v'])t.namespaces.add('v','urn:schemas-microsoft-com:vml','#default#VML')}function hsv2rgb(a){var R,G,B,X,C;var h=(a.h%360)/60;C=a.v*a.s;X=C*(1-Math.abs(h%2-1));R=G=B=a.v-C;h=~~h;R+=[C,X,0,0,X,C][h];G+=[X,C,C,X,0,0][h];B+=[0,0,X,C,C,X][h];var r=Math.floor(R*255);var g=Math.floor(G*255);var b=Math.floor(B*255);return{r:r,g:g,b:b,hex:"#"+(16777216|b|(g<<8)|(r<<16)).toString(16).slice(1)}}function rgb2hsv(a){var r=a.r;var g=a.g;var b=a.b;if(a.r>1||a.g>1||a.b>1){r/=255;g/=255;b/=255}var H,S,V,C;V=Math.max(r,g,b);C=V-Math.min(r,g,b);H=(C==0?null:V==r?(g-b)/C+(g<b?6:0):V==g?(b-r)/C+2:(r-g)/C+4);H=(H%6)*60;S=C==0?0:C/V;return{h:H,s:S,v:V}}function slideListener(d,e,f){return function(a){a=a||s.event;var b=mousePosition(a);d.h=b.y/e.offsetHeight*360+hueOffset;d.s=d.v=1;var c=hsv2rgb({h:d.h,s:1,v:1});f.style.backgroundColor=c.hex;d.callback&&d.callback(c.hex,{h:d.h-hueOffset,s:d.s,v:d.v},{r:c.r,g:c.g,b:c.b},u,b)}};function pickerListener(d,e){return function(a){a=a||s.event;var b=mousePosition(a),width=e.offsetWidth,height=e.offsetHeight;d.s=b.x/width;d.v=(height-b.y)/height;var c=hsv2rgb(d);d.callback&&d.callback(c.hex,{h:d.h-hueOffset,s:d.s,v:d.v},{r:c.r,g:c.g,b:c.b},b)}};var x=0;function ColorPicker(f,g,h){if(!(this instanceof ColorPicker))return new ColorPicker(f,g,h);this.h=0;this.s=1;this.v=1;if(!h){var i=f;i.innerHTML=w;this.slideElement=i.getElementsByClassName('slide')[0];this.pickerElement=i.getElementsByClassName('picker')[0];var j=i.getElementsByClassName('slide-indicator')[0];var k=i.getElementsByClassName('picker-indicator')[0];ColorPicker.fixIndicators(j,k);this.callback=function(a,b,c,d,e){ColorPicker.positionIndicators(j,k,e,d);g(a,b,c)}}else{this.callback=h;this.pickerElement=g;this.slideElement=f}if(v=='SVG'){var l=slide.cloneNode(true);var m=picker.cloneNode(true);var n=l.getElementsByTagName('linearGradient')[0];var o=l.getElementsByTagName('rect')[0];n.id='gradient-hsv-'+x;o.setAttribute('fill','url(#'+n.id+')');var p=[m.getElementsByTagName('linearGradient')[0],m.getElementsByTagName('linearGradient')[1]];var q=m.getElementsByTagName('rect');p[0].id='gradient-black-'+x;p[1].id='gradient-white-'+x;q[0].setAttribute('fill','url(#'+p[1].id+')');q[1].setAttribute('fill','url(#'+p[0].id+')');this.slideElement.appendChild(l);this.pickerElement.appendChild(m);x++}else{this.slideElement.innerHTML=slide;this.pickerElement.innerHTML=picker}addEventListener(this.slideElement,'click',slideListener(this,this.slideElement,this.pickerElement));addEventListener(this.pickerElement,'click',pickerListener(this,this.pickerElement));enableDragging(this,this.slideElement,slideListener(this,this.slideElement,this.pickerElement));enableDragging(this,this.pickerElement,pickerListener(this,this.pickerElement))};function addEventListener(a,b,c){if(a.attachEvent){a.attachEvent('on'+b,c)}else if(a.addEventListener){a.addEventListener(b,c,false)}}function enableDragging(b,c,d){var e=false;addEventListener(c,'mousedown',function(a){e=true});addEventListener(c,'mouseup',function(a){e=false});addEventListener(c,'mouseout',function(a){e=false});addEventListener(c,'mousemove',function(a){if(e){d(a)}})}ColorPicker.hsv2rgb=function(a){var b=hsv2rgb(a);delete b.hex;return b};ColorPicker.hsv2hex=function(a){return hsv2rgb(a).hex};ColorPicker.rgb2hsv=rgb2hsv;ColorPicker.rgb2hex=function(a){return hsv2rgb(rgb2hsv(a)).hex};ColorPicker.hex2hsv=function(a){return rgb2hsv(ColorPicker.hex2rgb(a))};ColorPicker.hex2rgb=function(a){return{r:parseInt(a.substr(1,2),16),g:parseInt(a.substr(3,2),16),b:parseInt(a.substr(5,2),16)}};function setColor(a,b,d,e){a.h=b.h%360;a.s=b.s;a.v=b.v;var c=hsv2rgb(a);var f={y:(a.h*a.slideElement.offsetHeight)/360,x:0};var g=a.pickerElement.offsetHeight;var h={x:a.s*a.pickerElement.offsetWidth,y:g-a.v*g};a.pickerElement.style.backgroundColor=hsv2rgb({h:a.h,s:1,v:1}).hex;a.callback&&a.callback(e||c.hex,{h:a.h,s:a.s,v:a.v},d||{r:c.r,g:c.g,b:c.b},h,f);return a};ColorPicker.prototype.setHsv=function(a){return setColor(this,a)};ColorPicker.prototype.setRgb=function(a){return setColor(this,rgb2hsv(a),a)};ColorPicker.prototype.setHex=function(a){return setColor(this,ColorPicker.hex2hsv(a),u,a)};ColorPicker.positionIndicators=function(a,b,c,d){if(c){b.style.left='auto';b.style.right='0px';b.style.top='0px';a.style.top=(c.y-a.offsetHeight/2)+'px'}if(d){b.style.top=(d.y-b.offsetHeight/2)+'px';b.style.left=(d.x-b.offsetWidth/2)+'px'}};ColorPicker.fixIndicators=function(a,b){b.style.pointerEvents='none';a.style.pointerEvents='none'};s.ColorPicker=ColorPicker})(window,window.document);
+!function(t,e,i){function o(e){if(t.event&&t.event.contentOverflow!==i)return{x:t.event.offsetX,y:t.event.offsetY};if(e.offsetX!==i&&e.offsetY!==i)return{x:e.offsetX,y:e.offsetY};var o=e.target.parentNode.parentNode;return void 0===e.offsetX?(o=o.getBoundingClientRect(),{x:e.pageX-o.x,y:e.pageY-o.y}):{x:e.layerX-o.offsetLeft,y:e.layerY-o.offsetTop}}function s(t,i,o){t=e.createElementNS(y,t);for(var s in i)t.setAttribute(s,i[s]);"[object Array]"!=Object.prototype.toString.call(o)&&(o=[o]);for(var n=0,r=o[0]&&o.length||0;n<r;n++)t.appendChild(o[n]);return t}function n(t){var e,i,o,s,n,r=t.h%360/60;n=t.v*t.s,s=n*(1-Math.abs(r%2-1)),e=i=o=t.v-n,r=~~r,e+=[n,s,0,0,s,n][r],i+=[s,n,n,s,0,0][r],o+=[0,0,s,n,n,s][r];var l=Math.floor(255*e),a=Math.floor(255*i),c=Math.floor(255*o);return{r:l,g:a,b:c,hex:"#"+(16777216|c|a<<8|l<<16).toString(16).slice(1)}}function r(t){var e=t.r,i=t.g,o=t.b;(t.r>1||t.g>1||t.b>1)&&(e/=255,i/=255,o/=255);var s,n,r,l;return r=Math.max(e,i,o),l=r-Math.min(e,i,o),s=0==l?null:r==e?(i-o)/l+(i<o?6:0):r==i?(o-e)/l+2:(e-i)/l+4,s=s%6*60,n=0==l?0:l/r,{h:s,s:n,v:r}}function l(e,s,r){return function(l){l=l||t.event;var a=o(l);a.y=a.y>s.clientHeight?s.clientHeight:a.y,a.y=a.y<0?0:a.y,e.h=a.y/s.offsetHeight*360+g;var c=n({h:e.h,s:1,v:1}),f=n({h:e.h,s:e.s,v:e.v});r.style.backgroundColor=c.hex,e.callback&&e.callback(f.hex,{h:e.h-g,s:e.s,v:e.v},{r:f.r,g:f.g,b:f.b},i,a)}}function a(e,i){return function(s){s=s||t.event;var r=o(s),l=i.offsetWidth,a=i.offsetHeight;r.x=r.x>i.clientWidth?i.clientWidth:r.x,r.x=r.x<0?0:r.x,r.y=r.y>i.clientHeight?i.clientHeight:r.y,r.y=r.y<0?0:r.y,e.s=r.x/l,e.v=(a-r.y)/a;var c=n(e);e.callback&&e.callback(c.hex,{h:e.h-g,s:e.s,v:e.v},{r:c.r,g:c.g,b:c.b},r)}}function c(t,e,i){if(!(this instanceof c))return new c(t,e,i);if(this.h=0,this.s=1,this.v=1,i)this.callback=i,this.pickerElement=e,this.slideElement=t;else{var o=t;o.innerHTML=m,this.slideElement=o.getElementsByClassName("slide")[0],this.pickerElement=o.getElementsByClassName("picker")[0];var s=o.getElementsByClassName("slide-indicator")[0],n=o.getElementsByClassName("picker-indicator")[0];c.fixIndicators(s,n),this.callback=function(t,i,o,r,l){c.positionIndicators(s,n,l,r),e(t,i,o)}}if("SVG"==u){var r=v.cloneNode(!0),p=d.cloneNode(!0),g=r.getElementsByTagName("linearGradient")[0],y=r.getElementsByTagName("rect")[0];g.id="gradient-hsv-"+x,y.setAttribute("fill","url(#"+g.id+")");var b=[p.getElementsByTagName("linearGradient")[0],p.getElementsByTagName("linearGradient")[1]],w=p.getElementsByTagName("rect");b[0].id="gradient-black-"+x,b[1].id="gradient-white-"+x,w[0].setAttribute("fill","url(#"+b[1].id+")"),w[1].setAttribute("fill","url(#"+b[0].id+")"),this.slideElement.appendChild(r),this.pickerElement.appendChild(p),x++}else this.slideElement.innerHTML=v,this.pickerElement.innerHTML=d;f(this.slideElement,"click",l(this,this.slideElement,this.pickerElement)),f(this.pickerElement,"click",a(this,this.pickerElement)),h(this,this.slideElement,l(this,this.slideElement,this.pickerElement)),h(this,this.pickerElement,a(this,this.pickerElement))}function f(t,e,i){t.attachEvent?t.attachEvent("on"+e,i):t.addEventListener&&t.addEventListener(e,i,!1)}function h(e,i,o){var s=!1;t.PointerEvent?(f(i,"pointerdown",function(t){s=!0}),f(i,"pointerup",function(t){s=!1}),f(i,"pointerout",function(t){s=!1}),f(i,"pointermove",function(t){s&&o(t)})):(f(i,"mousedown",function(t){s=!0}),f(i,"mouseup",function(t){s=!1}),f(i,"mouseout",function(t){s=!1}),f(i,"mousemove",function(t){s&&o(t)}))}function p(t,e,i,o){t.h=e.h%360,t.s=e.s,t.v=e.v;var s=n(t),r={y:t.h*t.slideElement.offsetHeight/360,x:0},l=t.pickerElement.offsetHeight,a={x:t.s*t.pickerElement.offsetWidth,y:l-t.v*l};return t.pickerElement.style.backgroundColor=n({h:t.h,s:1,v:1}).hex,t.callback&&t.callback(o||s.hex,{h:t.h,s:t.s,v:t.v},i||{r:s.r,g:s.g,b:s.b},a,r),t}var d,v,u=t.SVGAngle||e.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1")?"SVG":"VML",g=15,y="http://www.w3.org/2000/svg",m=['<div class="picker-wrapper">','<div class="picker" touch-action="none"></div>','<div class="picker-indicator"></div>',"</div>",'<div class="slide-wrapper">','<div class="slide" touch-action="none"></div>','<div class="slide-indicator"></div>',"</div>"].join("");"SVG"==u?(v=s("svg",{xmlns:"http://www.w3.org/2000/svg",version:"1.1",width:"100%",height:"100%"},[s("defs",{},s("linearGradient",{id:"gradient-hsv",x1:"0%",y1:"100%",x2:"0%",y2:"0%"},[s("stop",{offset:"0%","stop-color":"#FF0000","stop-opacity":"1"}),s("stop",{offset:"13%","stop-color":"#FF00FF","stop-opacity":"1"}),s("stop",{offset:"25%","stop-color":"#8000FF","stop-opacity":"1"}),s("stop",{offset:"38%","stop-color":"#0040FF","stop-opacity":"1"}),s("stop",{offset:"50%","stop-color":"#00FFFF","stop-opacity":"1"}),s("stop",{offset:"63%","stop-color":"#00FF40","stop-opacity":"1"}),s("stop",{offset:"75%","stop-color":"#0BED00","stop-opacity":"1"}),s("stop",{offset:"88%","stop-color":"#FFFF00","stop-opacity":"1"}),s("stop",{offset:"100%","stop-color":"#FF0000","stop-opacity":"1"})])),s("rect",{x:"0",y:"0",width:"100%",height:"100%",fill:"url(#gradient-hsv)"})]),d=s("svg",{xmlns:"http://www.w3.org/2000/svg",version:"1.1",width:"100%",height:"100%"},[s("defs",{},[s("linearGradient",{id:"gradient-black",x1:"0%",y1:"100%",x2:"0%",y2:"0%"},[s("stop",{offset:"0%","stop-color":"#000000","stop-opacity":"1"}),s("stop",{offset:"100%","stop-color":"#CC9A81","stop-opacity":"0"})]),s("linearGradient",{id:"gradient-white",x1:"0%",y1:"100%",x2:"100%",y2:"100%"},[s("stop",{offset:"0%","stop-color":"#FFFFFF","stop-opacity":"1"}),s("stop",{offset:"100%","stop-color":"#CC9A81","stop-opacity":"0"})])]),s("rect",{x:"0",y:"0",width:"100%",height:"100%",fill:"url(#gradient-white)"}),s("rect",{x:"0",y:"0",width:"100%",height:"100%",fill:"url(#gradient-black)"})])):"VML"==u&&(v=['<DIV style="position: relative; width: 100%; height: 100%">','<v:rect style="position: absolute; top: 0; left: 0; width: 100%; height: 100%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="0" color="red" color2="red" colors="8519f fuchsia;.25 #8000ff;24903f #0040ff;.5 aqua;41287f #00ff40;.75 #0bed00;57671f yellow"></v:fill>',"</v:rect>","</DIV>"].join(""),d=['<DIV style="position: relative; width: 100%; height: 100%">','<v:rect style="position: absolute; left: -1px; top: -1px; width: 101%; height: 101%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="270" color="#FFFFFF" opacity="100%" color2="#CC9A81" o:opacity2="0%"></v:fill>',"</v:rect>",'<v:rect style="position: absolute; left: 0px; top: 0px; width: 100%; height: 101%" stroked="f" filled="t">','<v:fill type="gradient" method="none" angle="0" color="#000000" opacity="100%" color2="#CC9A81" o:opacity2="0%"></v:fill>',"</v:rect>","</DIV>"].join(""),e.namespaces.v||e.namespaces.add("v","urn:schemas-microsoft-com:vml","#default#VML"));var x=0;c.hsv2rgb=function(t){var e=n(t);return delete e.hex,e},c.hsv2hex=function(t){return n(t).hex},c.rgb2hsv=r,c.rgb2hex=function(t){return n(r(t)).hex},c.hex2hsv=function(t){return r(c.hex2rgb(t))},c.hex2rgb=function(t){return{r:parseInt(t.substr(1,2),16),g:parseInt(t.substr(3,2),16),b:parseInt(t.substr(5,2),16)}},c.prototype.setHsv=function(t){return p(this,t)},c.prototype.setRgb=function(t){return p(this,r(t),t)},c.prototype.setHex=function(t){return p(this,c.hex2hsv(t),i,t)},c.positionIndicators=function(t,e,i,o){i&&(t.style.top=i.y-t.offsetHeight/2+"px"),o&&(e.style.top=o.y-e.offsetHeight/2+"px",e.style.left=o.x-e.offsetWidth/2+"px")},c.fixIndicators=function(t,e){e.style.pointerEvents="none",t.style.pointerEvents="none"},t.ColorPicker=c}(window,window.document);
\ No newline at end of file
diff --git a/themes.css b/themes.css
index 7a49d13..c61ccfa 100644
--- a/themes.css
+++ b/themes.css
@@ -13,6 +13,7 @@
 }
 .picker,
 .slide {
+    touch-action: none;
     cursor: crosshair;
     float: left;
 }