How to change the SpinnerButton in inputNumberSpinner

[v.bannur]

Hi All,

I have used rich:inputNumberSpinner and I need to replace the sminner buttons (i.e down and up arrow images) with my custom images.

Can any one please suggest how to do the changes?

Thanks

[v.bannur]

Richfaces,

Please help me

[jhuska]

Hi there,

have you tried to redefine rf-insp-inc class of inputNumberSpinner ? The background-image property ?

[v.bannur]

Hi Juraj,

I have used the specified class but still arrow images are not replacing. Can you please help me in this.

Is there any parent css class needs to be change?

And i have noticed in firebug the arrow images are coming from the button type image and in src they have hard coded the image path not from the css.

is class rf-insp-inc will override?

My code:

.rf-insp-inc{background-image: url(../images/common/panel_down_arrow.png) !important;}

<rich:inputNumberSpinner id ="noOfRooms"

      style="width: 50px; margin-right: 2px; border: 1px solid #cacaca; padding: 0px" inputSize="2"

      value="#{hotelSearchBean.searchRequest.noOfRoomItems}" immediate="true" maxValue="6" minValue="1"

      enableManualInput="false"

      valueChangeListener="#{hotelSearchBean.updateRoomConfiguration}">

      <a4j:support ajaxSingle="true" reRender="roomList" event="onchange" oncomplete="return Resize();"/>

</rich:inputNumberSpinner>