<script type="text/javascript">

YUI().use("dial", function(Y) {

var oneFrameWidth = 300,

framesInSprite = 13;

var dial = new Y.Dial({

min: 0,

max: 26000,

value: 13000, // initial value in the middle of a large range allows rotation both ways

minorStep: 1,

majorStep: 2,

stepsPerRevolution: framesInSprite,

diameter: 150

});

dial.render('#demo');

// Reposition the duck sprite background image

dial.on( "valueChange", function(e){

// Handle values greater than one revolution

var moduloValue = (e.newVal % framesInSprite);

Y.one('#duck').setStyle('backgroundPosition', (moduloValue * -oneFrameWidth) + 'px 0px');

}, '#duck' );

});

</script>