文本框(input)获取焦点(onfocus)时样式改变的实现方法

许多重视用户体验的设计师都希望给文本框(input)加上 获取焦点或者鼠标悬停时的样式切换效果。其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可。本文介绍了如何在 获取焦点时切换样式,明白原理后,实现其他效果就很简单了。


--------------------------------------------------------------



Javascript:
  1.  



    测试代码:
    HTML:
 
   
  1.  
  2. type="text/css">
  3. .normalInput {
  4. border:1px solid #ccc;
  5. }
  6. .focusInput {
  7. border:1px solid #FFD42C;
  8. }
  9.  
  10. type="text/javascript">
  11. window.onload = function () {
  12. focusInput('focusInput', 'normalInput');
  13. }
  14.  
  15. 文本框: type="text" class="normalInput" />
  16.  

你可能感兴趣的:(JavaScript)