تغيير لون خلفية الحقل الفعال

السلام عليكم و رحمة الله و بركاته

أحيانا عندما يملئ المستخدم نموذج ثم يتوقف قليلا قد ينسى اين كان :D أقصد هنا في أي حقل (input text)، هنا لنساعده قليلا نقوم بتغيير لون الخلفية للحقل الذي يكون فيه، حتى إذا نسى نفسه فإنه سيلاحظ اللون المتغير لذاك الحقل عن أخواته.

الدلة ActiveField تقوم أولا بالإحتفاظ باللون الحالي للخلفية بعدها تغير لون الخلفية أثناء الحدث onfocus، أما الدالة ResetColor فهي ترجع اللون الأصلي للحقل عند الحدث onblur، يعني هذا ليس بشيء كبير.

<html>
<head>

  <script type="text/javascript">  

   var BGc;

   function ActiveField(field) 
    {
	 if(navigator.appName == "Microsoft Internet Explorer")	
	  BGc = x.currentStyle;
	 else
	 // Other surfer's, must be compatible, I tested only in FireFox 3.6
	  BGc = window.getComputedStyle(field,null).getPropertyValue("backgroundcolor"); 
     field.style.background = '#228B22';
    } 
   function ResetColor(field)
    {
	 field.style.background = BGc;	
	}
  </script>

  <style type="text/css">
   input.text 
    {
     background-color: 000000;
     color:#FFFFFF;
    }
  </style>

</head>
<body>

<form method="post" name="form1" action="">
  <fieldset>
    <label>Password:</label>
    <input type="password" name="password" id="password" class="text" size="32" onfocus="ActiveField(password)" onblur="ResetColor(password)"/><br>
    <label>Re-Enter Password:</label>
    <input type="password" name="repassword" id="repassword" size="32" onfocus="ActiveField(repassword)" onblur="ResetColor(repassword)" /><br>
    <input type="submit" value="Submit" id="submit" >
  </fieldset>
</form>
</body>
</html>

بالمناسبة أخي Xacker ألم تجد حلا للون خط المحرر، لأني أحس و كأني أكتب في الظلام، بل علي أيضا أن اقوم بتحديد كامل النص لأعرف ماذا كتبت.

تغيير لون خلفية الحقل الفعال

مواضيع مشابهة