js实现跟随光标的提示框的代码
js跟随光标提示框的效果。
<html>
<head>
<title>跟随光标的提示框_jquery中文网_http://www.jquerycn.cn</title>
<mce:script type="text/javascript">
<!--
function clickTextInput(){
var msgDiv = document.getElementById("msg");
msgDiv.innerText="you click the text input.";
}
function mouseOverTextInput(){
var msgDiv = document.getElementById("msg");
msgDiv.innerText="your mousr over.";
}
//页面内元素的onmouseover事件的处理方法
document.onmousemove=function(){
if(event.srcElement.hint) {
a.style.display="block";
a.innerHTML=event.srcElement.hint;
a.style.left=window.event.clientX+10;
a.style.top=window.event.clientY+10;
setTimeout("a.style.display='none'",8000);
}else{
a.style.display="none"
}
}
// --></mce:script>
</head>
<body>
<form>
<table>
<tr>
<td><input name="yourname" hint="输入框" type="text" onclick="clickTextInput();" onmouseover="javascript:mouseOverTextInput();" />
<input hint="sssss"/>
</tr>
</table>
<p>
<input type="submit" name="Submit" value="提交" hint="mmmmmm" />
<select name="select" hint="xxxxx">
<option value="w">ss</option>
<option value="w">w</option>
<option value="t">e</option>
<option value="s">d</option>
</select>
</p>
<div id="msg"></div>
<div id="a" style="position:absolute;font-size:9pt;display:none;
border:1px solid black;background:lightyellow"
mce_style="position:absolute;font-size:9pt;
display:none;border:1px solid black;background:lightyellow"> </div>
</form>
</body>
</html>
您可能感兴趣的文章：
js光标定位的实例代码
js实现跟随光标的提示框的代码
js简单拖动层效果
js将光标聚焦在文本最后怎么实现
js实现页面加载时获取input文本框焦点
非常不错js弹出层效果代码
js实现textarea光标定位的方法(兼容IE和FF)
Js 正则限制只能输入数字或中文的代码
javascript特效-跟着鼠标飞的图片
js实现可拖动的对话框的几个例子