文本框(input)获取焦点(onfocus)时样式改变的实现方法
时间:2007-02-10 来源:白天的影子
许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果。其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可。本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他效果就很简单了。
--------------------------------------------------------------
点此浏览示例文件
--------------------------------------------------------------
Javascript:
测试代码:
HTML:
--------------------------------------------------------------
点此浏览示例文件
--------------------------------------------------------------
Javascript:
测试代码:
HTML:
- <style type="text/css">
- .normalInput {
- border:1px solid #ccc;
- }
- .focusInput {
- border:1px solid #FFD42C;
- }
- </style>
- 文本框:<input type="text" class="normalInput" />
相关阅读 更多 +