My favorites | Sign in
Project Logo
Project hosting will be READ-ONLY Wednesday, 7AM PST due to brief network maintenance
                
Show all Featured downloads:
jquery-spin.tar.gz
People details
Project owners:
  naohiko.mori

jQuery Spin button

Overview

This plugin provides spin-button interface easily on your form.

This interface is very handy to set especially short or middle range numbers.

Usage

Simply call "spin" method.

$(document).ready(function(){
  $('#number').spin();
});
<input type="text" id="number" value="0" />

You can specify the options with first argument.

$('#number').spin({max:100,min:0});

Options

imageBasePath

You need to specify your spin-button surface images. When all your spin-related-images are on a same directory(I hope so), you can set your image path onto this parameter.

default value is "/img/spin/".

spinBtnImage/spinUpImage/spinDownImage

The names of spin button images.

default value is "spin-button.png", "spin-up.png" and "spin-down.png". (these files are included in spin-image.tar.gz)

interval

Add/subtract this value from current value, when users click spin button.

default value is 1.

max/min

The maximum/minimum value. Null means unlimited.

default value is null.

timeInterval

While users keep pressing mouse button on the spin-button, the value will be increasing. This value is the time interval of increasing.

default value is 500(milli seconds)

timeBlink

The time interval of blinking the spin button when increasing/decreasing the value.

default value is 200(milli seconds)

btnClass

Specify your own class for button image.

btnCss

Specify your own styles as javascript object for button image.

txtCss

Specify your own styles as javascript object for input field.

lock

Prohibit direct input to text field. Please don't expect perfect.

decimal

Set decimal character in case you don't want to use '.'. eg. decimal: ','

beforeChange

Callback before value is changing. When you return "false", the changing would not happen. First argument is the new value, and second one is the current value.

changed

Callback after value has changed. First argument is the value.

buttonUp/buttonDown

Callback when up/down button has clicked. This function is called whether the value has changed.









Hosted by Google Code