We don’t need javascript for input box hover,focus style. We can use with CSS.It’s more easy and useful than javascript.
input[type=text]
{
/* CSS Code Here */
}
type=text mean for input type=text only. You can alos use foucs and hover for that.
input[type=text]:focus
{
/* CSS Code Here */
}
input[type=text]:hover
{
/* CSS Code Here */
}
Full Sample is following
[sourcecode lang="html"]
<html>
<head>
<title>Input box Demo</title>
<style>
input[type=text]
{
background-color:#EFCEAD;
}
input[type=text]:focus
{
background-color:#ADCEEF;
color:#333;
}
input[type=text]:hover
{
background-color:#CEADEF;
color:#fff;
}
</style>
</head>
<body>
<form>
<input type=”text” name=”sample”>
<input type=”text” name=”sample”>
<input type=”text” name=”sample”>
<input type=”text” name=”sample”>
<input type=”submit” value=”submit”>
</form>
</body>
</html>
[/sourcecode]
