Hover on element where attribute is set

Go To StackoverFlow.com

2

How can I put a hover style on an element which is not disabled? I tried the following, but there was no hover effect.

input.btn[disabled='false']:hover
2012-04-05 15:21
by clarkk
Is that sample something you tried? What happened - yoozer8 2012-04-05 15:23
Yes, have tried it.. No hover effect at all on any input.btn elm - clarkk 2012-04-05 15:25
I tested it in Chrome and it worked ok. It is important to note that IE7 and IE8 support attribute selectors only if a !DOCTYPE is specified and attribute selection isn't supported in IE6 and lower - Adam Stacey 2012-04-05 15:27


0

How about using the enabled selector?

<script>$("input:enabled").val("this is it");</script>

Here is a link to the docs http://api.jquery.com/enabled-selector/

2012-04-05 15:33
by Jrod
btw. It was not a jquery question : - clarkk 2012-04-05 15:37
For a css only solution I would add a class to inputs that are enabled and then target them with the css that way - Jrod 2012-04-05 15:45


1

I think you should rather use

input:not([disabled="disabled"]):hover {
    border: 1px solid red;
}​

But this pseudo-selector won't work in most of the browsers, I think.

See http://jsfiddle.net/xmKbt/5/.

2012-04-05 15:28
by Remo
I need it to be opposite.. have tried to remove the ~ but its the sam - clarkk 2012-04-05 15:33
Sorry, just figured out that I got it completely wrong. Just updated it with a solution that should work. However, the browser compatibility is not the best - Remo 2012-04-05 15:38
Another option would be to do the 'positive' thing and just manually add a class 'not_disabled' to the button which will make the selector a lot simpler - Remo 2012-04-05 15:39
Use :not([disabled]) instead, and don't forget the .btn class - BoltClock 2012-04-05 17:12


0

You cannot set a pseudo class according to Mozilla and MSDN.

2012-04-05 15:27
by Frank van Wijk
Ads