jQuery Spin Button Plugin: Sensible Spin

You may also like...

27 Responses

  1. Nelson Matias says:

    Hi, before all, you have developed a great plugin. I’ have a question. How can i reset the spins confs? Example: i want change the spin1 max value automatically to the actual spin2 value when i change the spin2 value. Do you understand?

  2. sudeesh says:

    hi i have using smart spinner for incremental value in decimal points. while incrementing it shows like 1.2000000. can any one help me. how to resolve this issue.

  3. harrije says:

    Does this spinner plugIn have a change method? For an already defined spinner, I would like to dynamically change the max property, and maybe other properties in the future. I believe jQuery has a change method, but I would prefer to use this plugIn instead because of it’s mask feature and it is more lightweight. The only think holding me back is I need to dynamically change the max.

  4. dhiraj_c says:

    Good work and must say a great plugin…

    But I have certain questions regarding the plugin:

    1. Under what type of license is this plugin offered? The reason I ask this is that I wish to use your plugin for on a tool which is commercial in nature… I am developing a web tool and wish to use this plugin there…

    2. I guess from the git repo I did not see any minimized version of this javascript. Do you not offer a minimized version of the jquery script. If not are we allowed to minimize your script so that we can easily bundle it with our tool?


  5. Onyx says:

    Wonderful work!

    As per Andy Kim’s statement, I had trouble with the spinner rolling to far, particularly in recent versions of Chrome / Chromium. The fix is to use setTimeout instead of set Interval, with a quarter-second period;

    el.mousedown(function(e) {
    isPgeInc = false;
    interval = setTimeout(onValueChange, 250);

  6. Medvezhonok says:

    I am using 8 smartspinners on a page. I want to initialize each of those to a different value from Javascript. When I do that using either .val(n) or .reset(n) I get strange results. As soon as I mouseover one of the spinners, the value gets changed to the initValue. If I use .reset() then all spinners except the last one get changed to the initValue, and the last one gets set to the value I used in the reset(). What am I doing wrong?

    • Can you show me how you are doing it, that would be easy for me to figure out the problem.

      • dhiraj_c says:

        Hi Shahbaz,

        I am facing the same issue. I guess the problem is the variable value and all other defined variable defined are being shared among all the created spin controls, so even if you set value using reset function or using some other way, the last set value get shared by all the created spin control.

        If you debug the script using chrome you will see that value variable is set as a Closure that is shared by all the spin controls…


  7. Seby says:

    Nice work …….2 questions :
    How can i dynamically disabled it via jquery ….?
    I have 1 field ….and after an triggered event i am make it read-only with Jquery …..but the mouse-well continue to work even on a read-only field …… that is not ok from my point of view .

    Cheers !

    • Seby says:

      i altered an function in the end …something like
      function setValue(a, b) {


      if (a >= settings.min && a <= settings.max ) {
      value = b;
      } el.val(value);
      So at least now is not modifying the values if the field is read-only !

      Cheers !

  8. Скороход says:

    Hello! Can’t download or view demo… :'(

  9. dykz says:

    Awasome resources. Good works

  10. Andy Kim says:

    This is very nice. The attention to detail is amazing.

    I found a small bug, though. When you don’t set the mask, deleting everything using the backspace key and then re-entering a number brings back the deleted number. Steps to reproduce:

    1) Download the demo code.
    2) Modify the spinner.htm file and take out the mask parameter from line 14.
    3) Open spinner.htm in a browser and put the text cursor at the end of the red number.
    4) Press the backspace key twice to delete the “40”
    5) Type in any number, such as 1

    Result: You get the 40 back

    Expected result: 1

    Environment: Mac OS X 10.6.7, Safari 5.0.5

    Work around:

    Commenting out line 113 of smartspinner.js fixes the problem, but it will introduce another problem if you do need to use masks.

    Other things I noticed:

    1) The default repeat delay is too small. I find that it often increments twice when I click the increment button. I had to change the wait interval to 250 ms from 100 ms to make it work for me.

    2) The value increases when I scroll down and decreases when I scroll up. Other spinner controls that do implement mousewheel support do it the opposite way but I’m not sure if this is a bug or by design.

    In any case, don’t let my bug report get you down. You’ve written something amazing and shared it with the world. High five 🙂

  11. Alan says:

    Everything looks ok, however when mousing over either the top or bottom arrow (graphic), the mouse pointer is a cursor. I can’t adjust the value at all using the mouse as intended. “Mask” also doesn’t seem to work. I can’t for the life of me figure out what’s wrong. Everything is in it’s place.

  12. Alan says:

    Everything seems to “look” ok, however mask isn’t working and the arrows don’t do anything. Pointer remains a “pointer” and I can not increase the numeric value using the arrows. ???

  13. Irwin Hakeem says:

    Quite! This was a really fantastic post. Thank you for ones furnished details.

  14. August Westerbeck says:

    Superb published report. It’ll be useful to anybody who usess it, including yours genuinely 🙂 . Keep up the good perform – for confident i’ll check out a lot more posts.

  15. Awesome! Subscribed and looking forward for more innovative resources! thumbs up!


  16. zahid says:


    Thanks Shahbaz for ur quick reply…

  17. zahid says:

    Good work…

    Does it allow entering values in the spinners?

    • Muhammad Shahbaz Saleem says:

      Yes, it does. The reason why you are not able to enter value with the keyboard is, the length of mask text is greater than the allowed no of digits for the controls in the demo. try deleting the mask text before entering values via keyboard 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *

Make sure you enter correct answer before you hit \'Send\' button *