manix Posted October 23, 2011 Share Posted October 23, 2011 K I've been struggling with this for quite some time now and I rly need some help <div> <input/> </div> when input is focused I need div's color to be changed, how do I do that? Link to comment https://forums.phpfreaks.com/topic/249639-selectors-issue/ Share on other sites More sharing options...
Frank P Posted October 24, 2011 Share Posted October 24, 2011 Actually, it is a question for the Javascript forum, but it is done like this: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xHTML"> <head> <title>Demo</title> <script type="text/javascript"> function setColor() { document.getElementById('inputDiv').style.background="yellow" } function resetColor() { document.getElementById('inputDiv').style.background="white" } </script> </head> <body> <form action=""> <div id="inputDiv" style="padding:10px;"> <input onfocus="setColor()" onblur="resetColor()" /> </div> </form> </body> </html> Link to comment https://forums.phpfreaks.com/topic/249639-selectors-issue/#findComment-1281762 Share on other sites More sharing options...
Frank P Posted October 24, 2011 Share Posted October 24, 2011 Although, this is better because you will probably have more than one input: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xHTML"> <head> <title>Demo</title> <script type="text/javascript"> function setColor(identification) { document.getElementById(identification).style.background="yellow" } function resetColor(identification) { document.getElementById(identification).style.background="white" } </script> </head> <body> <form action=""> <div id="inputDiv_1" style="padding:10px;"> <input type="" onfocus="setColor('inputDiv_1')" onblur="resetColor('inputDiv_1')" /> </div> </form> </body> </html> Link to comment https://forums.phpfreaks.com/topic/249639-selectors-issue/#findComment-1281766 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.