examples/slider/slider.js

   1 /*!
   2  * Ext JS Library 3.2.1
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7 Ext.onReady(function(){
   8
   9     new Ext.Slider({
  10         renderTo: 'basic-slider',
  11         width: 214,
  12         minValue: 0,
  13         maxValue: 100
  14     });
  15
  16     new Ext.Slider({
  17         renderTo: 'increment-slider',
  18         width: 214,
  19         value:50,
  20         increment: 10,
  21         minValue: 0,
  22         maxValue: 100
  23     });
  24
  25     new Ext.Slider({
  26         renderTo: 'vertical-slider',
  27         height: 214,
  28         vertical: true,
  29         minValue: 0,
  30         maxValue: 100
  31     });
  32
  33     new Ext.Slider({
  34         renderTo: 'tip-slider',
  35         width: 214,
  36         minValue: 0,
  37         maxValue: 100,
  38         plugins: new Ext.slider.Tip()
  39     });
  40
  41     var tip = new Ext.slider.Tip({
  42         getText: function(thumb){
  43             return String.format('<b>{0}% complete</b>', thumb.value);
  44         }
  45     });
  46
  47     new Ext.Slider({
  48         renderTo: 'custom-tip-slider',
  49         width: 214,
  50         increment: 10,
  51         minValue: 0,
  52         maxValue: 100,
  53         plugins: tip
  54     });
  55
  56     new Ext.Slider({
  57         renderTo: 'custom-slider',
  58         width: 214,
  59         increment: 10,
  60         minValue: 0,
  61         maxValue: 100,
  62         plugins: new Ext.slider.Tip()
  63     });
  64
  65     new Ext.Slider({
  66         renderTo: 'multi-slider-horizontal',
  67         width   : 214,
  68         minValue: 0,
  69         maxValue: 100,
  70         values  : [10, 50, 90],
  71         plugins : new Ext.slider.Tip()
  72     });
  73
  74     new Ext.Slider({
  75         renderTo : 'multi-slider-vertical',
  76         vertical : true,
  77         height   : 214,
  78         minValue: 0,
  79         maxValue: 100,
  80         values  : [10, 50, 90],
  81         plugins : new Ext.slider.Tip()
  82     });
  83 });