3
404<script src="../scripts/jquery-2.1.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a.tooltip").mouseover(function(e) {
var tooltip = "<p id='tooltip'>" + this.title + "</p>";
$("body").append(tooltip);
$("#tooltip")
.css({
"top": e.pageY + "px",
"left": e.pageX + "px"
}).show("fast");
}).mouseout(function() {
$("#tooltip").remove();
});
})
</script> <p><a href="#" class="tooltip" title="这是我的超链接提示1">提示1</a></p>
<p><a href="#" class="tooltip" title="这是我的超链接提示2">提示2</a></p>鼠标移动到a标签上，自定义的提示框却出现在下面，而不是鼠标触碰a标签的那个位置，我弹出鼠标的X,Y坐标都是正常的。
如图：
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
为CSS添加position:absolute属性
要用绝对定位吧，否则相对父节点定位
和<p>都是块级标签，而你是直接append<body>里面，就是放在<body>里面的最后。所以你hover的时候，提示都在最下面！你可以打开控制台看看元素。