javascript - change radio button color when not selected -


I have radio buttons + photos but the problem is that if the page is loaded, then all the radio buttons got color: None (this is good) If I click on the button before the color then the gray and the button gets selected: But if I click on the second button then change the button color and: is selected but the first button color is now It is also gray. How to deselect the colors on the first button.

  & lt; Div id = "my_div" & gt; Input type = "radio" name = "site" id = "like" & gt; & Lt; Label = "like" & gt; & Lt; Img src = "/ icons / disp.jpg" & gt; & Lt; Br> Title1 & lt; / Labels & gt; & Lt; Input type = "radio" name = "site" id = "sf" & gt; For label = "sf" & gt; & Lt; Img src = "/ icons / metal.jpg" & gt; & Lt; Br> MetTitle2 & lt; / Labels & gt; & Lt; / Div & gt;   

jquery

  $ ('# my_div input: radio'). AddClass ('input_hidden'); Click $ ('# My_div label') (function () {$ (this) .addClass ('selected'). Sister (). RemoveClass ('selected');});   

css

  .input_hidden {status: absolute; display none; }. Selected {background-color: # ccc; } #my_div Label {Display: Inline-Block; Cursor: indicator; } #my_div Label: Hover {background-color: one-green; } #my_div label img {padding: 3px; }    

You can get it by using pure CSS like this:

  input [type =" radio "]: check + label {background color: #ccc; } .input_hidden {status: complete; display none; } #my_div Label {Display: Inline-Block; Cursor: indicator; } #my_div Label: Hover {background-color: one-green; } #my_div label img {padding: 3px; }   
  & lt; Div id = "my_div" & gt; & Lt; Img src = "/ icons / disp.jpg" & gt; Title 1 & lt; Input type = "radio" name = "site" id = "like" & gt; For label = "like" & gt; & Lt; ; / Labels & gt; & Lt; Input type = "radio" name = "site" id = "sf" & gt; For label = "sf" & gt; & Lt; Img src = "/ icons / metal.jpg" & gt; & Lt; Br> MetTitle2 & lt; / Labels & gt; & Lt; / Div & gt;      

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -