当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 很可爱的输入框

Javascript
JQuery 学习笔记 选择器之四
JQuery 学习笔记 选择器之五
JQuery 学习笔记 选择器之六
JQuery CSS样式控制 学习笔记
用js模仿word格式刷功能实现代码 [推荐]
运用jquery实现table单双行不同显示并能单行选中
jqPlot jquery的页面图表绘制工具
jquery tools之tabs 选项卡/页签
jquery tools之tooltip
浅析Javascript原型继承 推荐
JQuery UI皮肤定制
实现lightBox时的样式与行为分离减少JS
JQuery 表格操作(交替显示、拖动表格行、选择行等)
javascript 进度条 实现代码
Javascript this指针
jquery imgareaselect 使用利用js与程序结合实现图片剪切
javascript 写的一个简单的timer
javascript 处理HTML元素必须避免使用的一种方法
Javascript 验证上传图片大小[客户端]
jQuery 隔行换色 支持键盘上下键,按Enter选定值

Javascript 中的 很可爱的输入框


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 322 ::
收藏到网摘: n/a

不错的输入框效果,主要是用到了一个背景动画 <!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>很可爱的输入框_软晨学习网_www.ruanchen.com</title>
<style>
.username_bg { background:url(http://img.ruanchen.com/"text" name="username" class="inputbox" onfocus="this.className='username_bg inputbox'" onblur="this.className='inputbox'" />
<input type="text" name="username1" class="inputbox" onfocus="this.className='username_bg inputbox'" onblur="this.className='inputbox'" />
</body>
</html>