Css – Hover, Selected and Active

[SivaParticipant]

Hi,
I went through your Jqwidgets CSS classname from the file “jqx.base.css”. Every control have some classnames, for example: radiobutton have, 1)Normal 2)Hover 3)checked 4)disabled 5)check with disabled. In the same radiobutton, i need some more classname means what can i do? it means
1) Onpress the mouse key(active state), here jqx fill state for only radio button?
2) checked with hover……?
3) checked with active………?

Same as i needed for each and every control, Please suggest us.

Thanks in advance.

[Peter StoevKeymaster]

Hi Siva,

You can learn about the CSS classes applied to the widgets on this page: http://www.jqwidgets.com/jquery-widgets-documentation/. In addition, you can use the Theme Builder tool for styling widgets.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SivaParticipant]

Hi peter,

Whatever u mentioned documents i already referred and these are classnames currently jqwidgets have for radiobutton:
.jqx-radiobutton
.jqx-radiobutton-default
.jqx-radiobutton-hover
.jqx-radiobutton-disabled
.jqx-radiobutton-disabled-box
.jqx-radiobutton-check-checked
.jqx-radiobutton-check-disabled
.jqx-radiobutton-check-indeterminate
.jqx-radiobutton-check-indeterminate-disabled
.jqx-radiobutton-rtl

Here i am asking the classname like,
1) radiobutton has checked with hover?
2) radiobutton onpress state?
3) radiobutton has checked with hover onpress state?

Please help us, how to achieve these states in jqWidgets?

[Peter StoevKeymaster]

Hi Siva,

May be you missed to see the exact help topic: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxcheckandradio/jquery-radiobutton-styling-and-appearance.htm. As you can see, these are states applied on hover, focus, etc.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SivaParticipant]

hi peter,

ya i saw this too, but “jqx-fill-state-focus” or “jqx-fill-state-hover” these are common classname for all controls. how can i use this only on radiobutton? or checkbox?

if i want to use this focus “jqx-fill-state-focus” classname for radiobutton or checkbox, it should be like “jqx-radiobutton-fill-state-focus” or “jqx-checkbox-fill-state-focus”. Will you understand what am i saying?

[Peter StoevKeymaster]

Hi Siva,

.jqx-radiobutton .jqx-fill-state-hover would be applied only to jqxRadioButton. You can use common classes and make them specific if you wish with CSS selectors implemented in the correct way. If you want to learn more about CSS Selectors and how they work, please look at: http://www.w3schools.com/cssref/css_selectors.asp

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SivaParticipant]

Hi peter,

Thanks, it works. I used this classname for checkbox “.jqx-checkbox-xerox .jqx-fill-state-focus”, when checkbox on mouse pressed it will take this classname and get my css styles.
So “.jqx-fill-state-focus” apply to checkBox, it means – when it is focused and last focused item. Am i correct?

Thanks

[Peter StoevKeymaster]

Hi Siva,

jqx-fill-state-focus is applied only for HTML Elements which are on focus.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SivaParticipant]

ya ok. thanks peter

[Author]

Posts