I have been searching but have come up blank and i\'m wondering if I can use one jQuery statement to target multiple elements on a page. I have several identical buttons on a pa
You may also want to consider not using jQuery or Javascript at all for this. CSS should be sufficient. Just give each button the same class and do something like this in your CSS:
.button .buttonLeft
{
background: url(/images/concaveBtn-Left.gif)
}
.button .buttonMiddle
{
background: url(/images/concaveBtn-Middle.gif);
color: #666;
}
.button .buttonRight
{
background: url(/images/concaveBtn-Right.gif)
}
.button:hover .buttonLeft
{
background: url(/images/concaveBtn-Left2.gif)
}
.button:hover .buttonMiddle
{
background: url(/images/concaveBtn-Middle2.gif);
color: #ffffff;
}
.button:hover .buttonRight
{
background: url(/images/concaveBtn-Right2.gif)
}
There is one caveat, however; IE (at least some versions?) doesn't support :hover on divs. The way I work around this is by making a button an and place the elements to be styled inside of the button as
s.