我看了JQuery教程学会了鼠标事件,做了这个颠末期会有对话框出来,是渐显的,还会跟从鼠标提示,利用a标签的title也可以是做到提示,但不是很有本性。我照旧较量喜欢这个jq的提示特效,可以做在要害词上照旧不错的。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery鼠标颠末淡入显示提示框 演示</title> <script type="text/javascript" src=""></script> <style type="text/css"> .div{ border:1px solid #0000FF; float:left; width:200px; height:200px; margin:10px;} div#tip{ position:absolute; width:100px; height:auto; border:1px solid #00CC66;} .div1{border:0;cursor:pointer;width:auto; height:auto;} </style> </head> <body> <div>提示内容</div> <div></div> <div></div> <div>enenba</div> <script type="text/javascript"> $(document).ready(function(){ $('.div').hover( function(){ $('#tip').fadeIn('slow'); } ); $('.div').mousemove(function(e){ var top = e.pageY+5; var left = e.pageX+5; $('#tip').css({ 'top' : top + 'px', 'left': left+ 'px' }); }); $('.div').mouseout(function(){ $('#tip').hide(); }); }); </script> </body> </html>看附件演示
end
附件下载/演示源码:
【 mouse.html 】 1.04KB
分享到: 更多
相关日志:
event.preventDefault
利用JQuery 到达淡入谈出显示埋没的结果
tab申缩滑动特效 JQ插件kwicks
phpQuery—基于jQuery的PHP实现
第一次利用jquery
jquery取表单的值