A friend of mine set me up with a script that adds helper text to empty text boxes and removes it on click. My problem is I am trying to teach myself JavaScript and can not figure out how to add a functions to toggle the text color of the boxes from style="color:#888888 to style="color:#000000 with onlick and onblur in the same way the textbox value changes. My lack of knowledge has left me very frustrated. If anyone can help me with this it would really help my understanding and I would be very grateful. Thank you for any help. <html> <head> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Sub Type</title> </head> <body> <script language="javascript"> function chgTxt(a, b){ if(a.value==b){ a.value=''}else if(a.value==''){ a.value=b; }else{ a.value=a.value; } } function chkTxt(a, b){ if(a.value==''){ a.value=b; }else{ a.value=a.value; } } </script> <input name="chgTxt" type="text" id="txtType" onfocus="chgTxt(this, 'Sub Type');" onblur="chkTxt(this, 'Sub Type');" value="Sub Type"> <input name="artist" type="text" id="txtArtist" value="Artist" onfocus="chgTxt(this, 'Artist');" onblur="chkTxt(this, 'Artist');"> </body> </html> Code (markup):
Use a.style.color = '#888888'; for you example like this: <html> <head> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Sub Type</title> </head> <body> <script language="javascript"> function chgTxt(a, b){ if(a.value==b){ a.value=''; a.style.color = '#888888'; } } function chkTxt(a, b){ if(a.value==''){ a.value=b; a.style.color = '#000000'; } } </script> <input name="chgTxt" type="text" id="txtType" onfocus="chgTxt(this, 'Sub Type');" onblur="chkTxt(this, 'Sub Type');" value="Sub Type"> <input name="artist" type="text" id="txtArtist" value="Artist" onfocus="chgTxt(this, 'Artist');" onblur="chkTxt(this, 'Artist');"> </body> </html> Code (markup):