'use strict';

require('rc-slider/assets/index.less');

var React = require('react');
var Slider = require('rc-slider');

function onChange(v) {
  console.log(v);
}

React.render(
  <div>
    <div style={{width:400,margin:100}}>
      <Slider onChange={onChange} tipTransitionName='rc-slider-tooltip-zoom-down'/>
    </div>
    <div style={{width:400,margin:100}}>
      <Slider marks={["一","二","三","四","五"]} defaultIndex={2}/>
    </div>
    <div style={{width:400,margin:100}}>
      <Slider withDots step={20}/>
    </div>
    <div style={{width:400,margin:100}}>
      <Slider step={20}/>
    </div>
  </div>
  , document.getElementById('__react-content'));

@@ -597,16 +597,311 @@
  %3C/div%3E%0A
+    %3Cdiv style=%7B%7Bwidth:400,margin:100%7D%7D%3E%0A      %3Cp%3E%E5%8C%85%E5%90%AB%E5%85%B3%E7%B3%BB%3C/p%3E%0A      %3CSlider marks=%7B%5B%22%E7%8A%B6%E6%80%811%22,%22%E7%8A%B6%E6%80%812%22,%22%E7%8A%B6%E6%80%813%22,%22%E7%8A%B6%E6%80%814%22%5D%7D defaultIndex=%7B1%7D /%3E%0A    %3C/div%3E%0A    %3Cdiv style=%7B%7Bwidth:400,margin:100%7D%7D%3E%0A      %3Cp%3E%E5%B9%B6%E5%88%97%E5%85%B3%E7%B3%BB%3C/p%3E%0A      %3CSlider marks=%7B%5B%22%E7%8A%B6%E6%80%811%22,%22%E7%8A%B6%E6%80%812%22,%22%E7%8A%B6%E6%80%813%22,%22%E7%8A%B6%E6%80%814%22%5D%7D isIncluded=%7Bfalse%7D defaultIndex=%7B1%7D /%3E%0A    %3C/div%3E%0A
   %3C/div%3E

update demo.