Always visible slider's tip

http://stackoverflow.com/questions/15198053/always-show-the-tip-text-of-slider-in-extjs

HTML

<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.1.0-gpl/resources/css/ext-all.css">
<script src="http://cdn.sencha.io/ext-4.1.0-gpl/ext-all.js"></script>

JavaScript

Ext.define('AlwaysVisibleTip', {
    extend: 'Ext.slider.Tip',
    
    init: function(slider) {
        var me = this;
        me.callParent(arguments);
        slider.removeListener('dragend', me.hide);
        slider.on({
            scope: me,
            change: me.onSlide,
            afterrender: {
                fn: function() {
                    me.onSlide(slider, null, slider.thumbs[0]);
                },
                delay: 100
            }
        });
    }
});

Ext.create('Ext.slider.Single', {
    animate: false,
    plugins: [Ext.create('AlwaysVisibleTip',{
        getText: function(thumb) {
            var months = ['','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
            return Ext.String.format(months[thumb.value]);
        }
    })],
    tipText: function(thumb) {return 'hello'; },
    width: 200,
    value: 6,
    increment: 1,
    minValue: 1,
    maxValue: 12,
    renderTo: Ext.getBody()
});