-
1. Re: [inputNumberSlider] change color of the inslider track
nbelaevski Aug 14, 2009 6:18 PM (in response to ronchman07)Hi,
You can easily trace CSS styles using Firebug tool for Firefox. -
2. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 3:45 AM (in response to ronchman07)Hi, that's me agian, but with a different account name because I could not Login with the other one (I do not know why).
Anyway, I think you have misunderstood my question. I wanted to know how to change the background color of the inputNumberSlider, as shown in the pictures.
I wanted to have a source code sample of this, including both declaration in JSP, and the corresponding class in CSS. I cannot undersatnd the user guide documentation, it is really unclear on this topic.
Thank you for helping! -
3. Re: [inputNumberSlider] change color of the inslider track
nbelaevski Aug 17, 2009 5:07 AM (in response to ronchman07)The basic principle is the following (it's called "style class redefinition method" in documentation): each RF component has a set of predefined rich-* classes that are rendered for each significant HTML tag and define this element's row. E.g. http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_panel.html#d0e35713. So, you don't have to define them in component's attributes, but just define CSS classes with them. You can use documentation or Firebug to select the particular class for redefinition.
-
4. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 8:03 AM (in response to ronchman07)Ok, thank you for helping!
The thing is, now I approximatively know how to use the CSS with the inputNumberSlider, it still gives me a wrong way of coloring, once again, I add a new picture of what I want, and what I really get:
http://img15.imageshack.us/img15/1640/numberslider.png
Here is my JSP code:<rich:inputNumberSlider id="sl1" value="#{dataLink.value2}" width="500" minValue="1950" maxValue="2009" showToolTip="true" />
and a part of my CSS file:.rich-slider, .rich-slider-track, .rich-inslider-handler, .rich-inslider-handler-selected, .rich-inslider-field, .rich-inslider-tip{ background-color:#ff88ee; }
Once again, this is not a problem of the color, but the place of the color: instead of the track background colored, I get a stripe above the track colored.
Don't you think there is a problem in my code?
Thank you for helping. -
5. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 8:07 AM (in response to ronchman07)Sorry, I was mistaken, my CSS is:
.rich-slider, .rich-inslider-track, .rich-inslider-handler, .rich-inslider-handler-selected, .rich-inslider-field, .rich-inslider-tip{ background-color:#ff88ee; }
-
6. Re: [inputNumberSlider] change color of the inslider track
ilya_shaikovsky Aug 17, 2009 8:22 AM (in response to ronchman07)you should redefine rich-inslider-track only with bg-color and not forget to define bg-image as none. Following Nick's advice about fireBug you could check it on your own.
-
7. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 10:02 AM (in response to ronchman07)Ok, but I think i am following your advice:
here is my CSS:.rich-inslider-track{ background-color:red; }
My JSP is the same as before. Still, I do not get the background color of the inputNumberSlider changed. It is still blueSky.
I just want a code that acts as if I changed the blueSky parameter in my web.xml file.
Is that possible? -
8. Re: [inputNumberSlider] change color of the inslider track
ilya_shaikovsky Aug 17, 2009 10:09 AM (in response to ronchman07)
not forget to define bg-image as none. -
9. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 10:23 AM (in response to ronchman07)Sorry, I forgot to mention this:
I have no background image in my page, and I also tried in my CSS file:body { background-image:none; } .rich-slider-track{ background-color:red; }
and also:.rich-slider-track{ background-color:red; background-image:none; }
and also:.rich-slider-track{ background-color:red; image:none; }
I precise this is the only content of my CSS file. I still get nothing changed.
Thank you for helping me! -
10. Re: [inputNumberSlider] change color of the inslider track
ilya_shaikovsky Aug 17, 2009 10:37 AM (in response to ronchman07)I have no background image in my page,
but the slider itself has bg-image defined.... -
11. Re: [inputNumberSlider] change color of the inslider track
ronchon07 Aug 17, 2009 10:39 AM (in response to ronchman07)Ok, now I have the right code for the CSS:
.rich-inslider-track{ background-color:red; background-image:none; }
I'm confused I was trying with "rich-slider-track" because Eclipse does not recognize "inslider".
That was hard to understand, I don't think the fact to put "background-image:none" is mentionned in the Reference Guide, nor anywhere else.
Thank you very much, it is highly appreciated.