jQuery UI Spinner Width

Jimbo picture Jimbo · Jan 3, 2014 · Viewed 9.3k times · Source

I use the jQuery UI spinner in my pages which are now required to be responsive, thus presenting the challenge of adjusting the width of my jQuery UI spinners dynamically.

Does anyone know of any way to do this?

HTML

<input type="text" id="myspinner" style="width: 50px" />

JavaScript

$(function(){ 
    $("#myspinner").spinner(); 
});

Answer

Jimbo picture Jimbo · Jan 3, 2014

SOLVED

Sorry, I was being a bit retarded and looking for a jQuery way around this problem but have since realized that I could have just adjusted the original input box's CSS width to achieve the desired effect as below

@media screen and (max-width: 1000px) and (min-width: 480px) {
    #myspinner{
        width: 30px;
    }
}

or if you'd rather use jQuery

$("#myspinner").width(30);

Once this is called, the jQuery UI widget automatically resizes around the input box