页面导航：首页 → 网络编程 → JavaScript → 表单特效 → 正文内容

鼠标放在放在输入框上面提示效果

发布：dxy 字体：[增加减小] 类型：转载

点击运行可以看到效果:

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
<title>鼠标提示</title>  
<script language="JavaScript">  
function seashowtip(tips,flag,iwidth){  
var my_tips=document.all.mytips;  
if(flag){  
    my_tips.innerHTML=tips;  
    my_tips.style.display="";  
    my_tips.style.width=iwidth;  
    my_tips.style.left=event.clientX+10+document.body.scrollLeft;  
    my_tips.style.top=event.clientY+10+document.body.scrollTop;  
   }  
else   
  {  
   my_tips.style.display="none";  
   }  
}  
</script>  
<style>  
body{font-size:12px}  
</style>  
<div id=mytips style="position:absolute;background-color:#ffffff;width:121;height:16;border:1px solid gray;display:none;filter: progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3); left:0; top:5"></div>  
</head>  
<body>  
<form name="form1" method="post" action="">  
  用户名：   
  <input type="text" name="textfield"  tips="*** 输入用户名." onmousemove=seashowtip(this.tips,1,150) onmouseout=seashowtip(this.tips,0,150)>

密  码：   
  <input type="text" name="textfield2"  tips="*** 输入密码." onmousemove=seashowtip(this.tips,1,150) onmouseout=seashowtip(this.tips,0,150)>

验证码：   
  <input type="text" name="textfield3"  tips="*** 输入验证码." onmousemove=seashowtip(this.tips,1,150) onmouseout=seashowtip(this.tips,0,150)>  
  <input type="submit" name="Submit" value="提交">  
</form>  
</body>  
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

Tags：鼠标放在放在输入框上面提示效果