Link to reflect radio button selection

Hi there,

I have a quick question about a little piece of code that I’m trying to figure out.

I am trying to get a css-styled button to stay on its ‘roll-over’ state once it has been selected by its corresponding radio button (connected via the label tag). So far, I have no idea what I’m doing.

Here’s what I have so far:
http://www.kinkarso.com/testing/index.html

This is what it’s doing:

This is what I’d like it to do:
http://is.gd/d6W3m

Any experts out there that can lend a hand :)?

Thanks!
Donny

Thanks, that’s very helpful. Was finally able to get it to function correctly.

Donny

You can change your css to something like the following:

a.button:hover,
a.button.selected {
	color:#333333;
	background:url(yes.png) no-repeat 0px -176px;
}

Then in your script just add the ‘selected’ css class to the corresponding anchor tag:

(using jquery)


$(document).ready(function() {
    $("input[type='radio']").click(function() {
        $(this).parents("label").find(".button:first").each(function() {
                $(this).toggleClass("selected");
         });
    });
});

Good luck

If you are ok using javascript you could force it to use the hover style once selected.