1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>login</title> 6 <script type="text/javascript" src='/images/loading.gif' data-original="jquery.min.js"></script> 7 </head> 8 <style> 9 body{10 margin:0;11 padding:40px;12 background:#fff;13 font:80% Arial, Helvetica, sans-serif;14 color:#555;15 line-height:180%;16 }17 18 p{19 clear:both;20 margin:0;21 padding:.5em 0;22 }23 24 #tooltip{25 position:absolute;26 border:1px solid #333;27 background:#f7f5d1;28 padding:1px;29 color:#333;30 display:none;31 }32 </style>33 <body>34 35 <p><a href="#" class="tooltip" title="这是我的超链接提示1">提示1</a></p>36 <p><a href="#" class="tooltip" title="这是我的超链接提示2">提示2</a></p>37 <p><a href="#" title="这是自带提示1">自带提示1</a></p>38 <p><a href="#" title="这是自带提示2">自带提示2</a></p>39 40 <script>41 $(function () {42 $("a.tooltip").mouseover(function(e){43 44 var tooltip="<div id='tooltip'>"+this.title+"</div>";45 46 $("body").append(tooltip);47 48 $("#tooltip")49 .css({50 "top":e.pageY+"px",51 "left":e.pageX+"px"52 }).show("fast");53 }).mouseout(function(){54 $("#tooltip").remove();55 });56 });57 58 59 </script>60 </body>61 </html>
jQuery 事件 - pageY 属性
显示鼠标指针的位置
show() 方法
显示所有隐藏的 <p> 元素:
注意:show() 适用于通过 jQuery 方法和 CSS 中 display:none 隐藏的元素(不适用于通过 visibility:hidden 隐藏的元素)。
JQuery中这个function(e)那个e是什么意思?
回答一:e是事件,在firefox中只能在事件现场使用window.event,所以只有把event传给函数使用。为了兼容FF和其它浏览器,一般会在函数里重新给e赋值:
e = window.event || e;
也就是说,如果window.event存在,则该浏览器支持直接使用window.event,否在就是不支持,不支持就使用传进来的e。
回答二:事件对象event 和我们普通写的 <input type="text" onclick = "aaa(event)">中的这个event一模一样
jquery里边的事件绑定函数中的参数e 都是在框架中给处理好了的 兼容各种浏览器
原标题:jquery实现链接的title快速出现
关键词:jquery