Solved

Highlight changed Radiobutton in Chrome not working

Posted on 2014-04-02
8
150 Views
Last Modified: 2014-04-03
I have a simple highlight that just puts a halo around a changed Radio button, it can be seen at this jsFiddle

http://jsfiddle.net/V6DSn/3/

It works OK in IE but not in Chrome. Any ideas from the experts?

Andy
0
Comment
Question by:Andy Green
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
8 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 39972060
yes, that work only on IE.
you need to replace them check this : http://jsfiddle.net/V6DSn/4/

               $('input:radio').click(function () {
                   //remove all 
                   $('input:radio').parent().removeClass("highlight");
                   //add currect
                   $(this).parent().addClass("highlight");
               });

Open in new window

0
 
LVL 3

Author Comment

by:Andy Green
ID: 39972082
Thanks leakim971 but its gone the other way now. Doesn't work in IE. Is there a cross browser solution

Andy
0
 
LVL 82

Expert Comment

by:leakim971
ID: 39972089
for IE add this CSS :

:checked { 
    background-color: red;
}

Open in new window

0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 3

Author Comment

by:Andy Green
ID: 39972101
I have done that:



http://jsfiddle.net/V6DSn/5/


Problem now is that in IE the radio stays red when I select another button. Works OK in Chrome.

Andy
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39972209
replace click by change : http://jsfiddle.net/V6DSn/8/
0
 
LVL 3

Author Comment

by:Andy Green
ID: 39973546
All text highlightedHmm. It works in JS fiddle, but in  my page this happens when I select any Radio button:

All the text is highlighted with the background colour, not just the radio.

See image.

More on this tomorrow. fed up with it now.
0
 
LVL 3

Author Comment

by:Andy Green
ID: 39974418
If I can rewind - this is using actual markup from my app: http://jsfiddle.net/kXufK/2/

This works in IE but not in Chrome

Andy
0
 
LVL 3

Author Closing Comment

by:Andy Green
ID: 39974530
My original query has been answered. So points for that. I'll open another question for my on going problem.

Thanks

Andy
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

617 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question