首页>>Jquery文字>>拖动改变百分比的动画，水平和垂直(2015-08-06)

拖动改变百分比的动画，水平和垂直

拖动改变百分比的动画，水平和垂直
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

JavaScript Code
  1. <script type="text/javascript">  
  2.     $(document).ready(function(){  
  3.   
  4.         $('#slider1').sGlide({  
  5.             'width': 85,  
  6.             'height': 12,  
  7.             'image': 'img/knob.png',  
  8.             'startAt': 70,  
  9.             'colorStart': '#360',  
  10.             'colorEnd': '#693',  
  11.             'buttons': true,  
  12.             drag: function(o){  
  13.                 console.log('drag',o);  
  14.                 $('.pct').html(Math.round(o.value)+'<sup>%<sup>');  
  15.             },  
  16.             onButton: function(o){  
  17.                 console.log('button',o);  
  18.                 $('.pct').html(Math.round(o.value)+'<sup>%<sup>');  
  19.             }  
  20.         });  
  21.   
  22.         $('#slider2').sGlide({  
  23.             'startAt': 50,  
  24.             'flat': true,  
  25.             'width': 300,  
  26.             'unit': 'px',  
  27.             'snap': {  
  28.                 'points': 5,  
  29.                 'markers': true,  
  30.                 'onlyOnDrop': true  
  31.             },  
  32.             'vertical': true,  
  33.             'showKnob': false  
  34.         });  
  35.   
  36.     });  
  37. </script>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_498.html