Change label color on input focus |
Change label color on input focus |
RainLover |
Jun 7 2012, 01:18 PM
Post
#1
|
Advanced Member Group: Members Posts: 216 Joined: 16-November 09 Member No.: 10,346 |
Hi,
Here's a sample form: CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Sample Form</title> </head> <body> <form action="#"> <label for="fname">First name</label><input type="text" id="fname"> <br> <label for="lname">Last name</label><input type="text" id="lname"> </form> </body> </html> I wonder how I can change the label color when I focus/tab on its text filed? How can I do it through JavaScript if CSS doesn't work here? Thanks in advance! Mike |
Christian J |
Jun 8 2012, 03:14 PM
Post
#2
|
. Group: WDG Moderators Posts: 9,656 Joined: 10-August 06 Member No.: 7 |
Maybe something like this?
CODE function highlight(elem_id) { var elem=document.getElementById(elem_id); elem.onfocus=function() { this.previousSibling.className='focus'; } elem.onblur=function() { this.previousSibling.className=''; } } highlight('fname'); highlight('lname'); |
RainLover |
Jun 8 2012, 08:31 PM
Post
#3
|
Advanced Member Group: Members Posts: 216 Joined: 16-November 09 Member No.: 10,346 |
Maybe something like this? CODE function highlight(elem_id) { var elem=document.getElementById(elem_id); elem.onfocus=function() { this.previousSibling.className='focus'; } elem.onblur=function() { this.previousSibling.className=''; } } highlight('fname'); highlight('lname'); You're so helpful! I really appreciate it! |
Lo-Fi Version | Time is now: 23rd April 2024 - 04:15 PM |