tozq6g
Last Updated: February 25, 2016
·
16K
· balintgaspar
Caa8460e6e3965d920f1a048eb7c1456

Animating jquery knob to a value

for the awesome plugin from Anthony Terrien

http://anthonyterrien.com/knob/

here is a little snippet to change the knob value to another with animation.

$(document).ready(function(){        

$({value: 0}).animate({value: 75}, {
    duration: 1000,
    easing:'swing',
    step: function() 
    {
        $('.animated').val(Math.ceil(this.value)).trigger('change');
    }
})
});

You can see it in action: http://okami.hu/titis.html

scroll to te bottom..:)

Say Thanks
Respond

8 Responses
Add your response

1767
7831f9c652845c34091da263b689cc25

Working an something similar: http://eskimoblood.github.com/jim-knopf/

over 1 year ago ·
1775
2017 cs

really great :)

over 1 year ago ·
1782
7831f9c652845c34091da263b689cc25

Thanks. Still working on it as the API isn't that nice yet.

over 1 year ago ·
6800

on which line number should i add this Code?

over 1 year ago ·
6801
Caa8460e6e3965d920f1a048eb7c1456

@myandroidrocks: Jquery Knob uses input fields to getting the current value for knob with the code above you can animate the input field value, so you can place this code to your application.js or site.js or something else you use in your website or application:)

Knob also listening to input field change event, and at the end of the code snippet we call trigger change event.

over 1 year ago ·
6859

Exactly what I was looking for. Thanks !

over 1 year ago ·
6860
Caa8460e6e3965d920f1a048eb7c1456

The big credits goes to Anthony Terrien for the plugin, I' just extending the usage:)

over 1 year ago ·
13478
17bab6699395ad794d9fb12b53ac2127

Thank you very much! It's very helpful to me.The UI is so beautiful.

over 1 year ago ·