懂视1
懂视101
懂视201
懂视301
懂视401
懂视501
懂视601
懂视701
懂视801
懂视901
懂视1001
懂视1101
懂视1201
懂视1301
懂视1401
懂视1501
懂视1601
懂视1701
懂视1801
懂视1901
文库1
文库101
文库201
文库301
文库401
文库501
文库601
文库701
文库801
文库901
文库1001
文库1101
文库1201
文库1301
文库1401
文库1501
文库1601
文库1701
文库1801
文库1901
喜迪情感
全部频道
首页
科技
教育
生活
旅游
时尚
美容
美食
健康
体育
游戏
汽车
家电
您的当前位置:
首页
javascript输入文本框时的友好提示_表单特效
javascript输入文本框时的友好提示_表单特效
来源:喜迪情感
下面的代码实现当用户停留在text输入框的时候提示输入什么的提示信息,提高用户粘合度。
在输入内容前,显示如图1所示
图1
当用户名的文本框或得焦点时,效果如图2所示
图2
当密码文本框或得焦点时,效果如图3所示
图3
演示的源代码如下:
tt控件演示
//tipTxt要显示的内容,apos向右移动的距离,vpos向下移动的距离 function tip(tt,tipTxt,apos,vpos){ if(apos==undefined){ var apos=0; } if(vpos==undefined){ var vpos=0; } var dads = document.all.tipDiv.style; dads.display="block"; var th = tt; var ttop = tt.offsetTop-tt.clientHeight+vpos; //TT控件的定位点高 var thei = 20; //TT控件本身的高 var tleft = tt.offsetLeft; var tleft = tt.offsetLeft+tt.offsetWidth+apos; var twidth=100; var ttyp = tt.type; while (tt = tt.offsetParent){ ttop+=tt.offsetTop; tleft+=tt.offsetLeft; } dads.top = ttop+thei+6; dads.left = tleft; dads.width =twidth; document.all.taemTip.innerHTML="
"+tipTxt+"
"; } function notTip(){ var dads = document.all.tipDiv.style; dads.display="none"; } script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
显示全文