我有以下 jQuery 代码:
$('span.readMoreReputation').mouseover(function(event) {
createTooltip(event);
}).mouseout(function(){
// create a hidefunction on the callback if you want
hideTooltip();
});
function createTooltip(event){
$('<div class="tooltip">test</div>').appendTo('body');
positionTooltip(event);
};
function positionTooltip(event){
var tPosX = event.pageX - 10;
var tPosY = event.pageY - 20;
$('div.tooltip').css({'position': 'absolute', 'top': tPosY, 'left': tPosX});
};
它工作得很好,但我想复制 qtip (jquery 插件)的工作原理。当我将鼠标移到 READ MORE 文本(代码中的事件)上时,附加的 div 会跟随鼠标围绕 READ MORE 文本。
我希望将其放置在“阅读更多”文本的固定位置。
有什么想法为什么要这样做吗?
最佳答案
我试图使用 jQuery 函数 Offset 和 Position 来实现某些功能,但它们不会返回任何内容。也许这就是我在 jsfiddle 中的方式?我不知道,无论如何,这是一种方法:http://jsfiddle.net/jMYkS/1/
我添加了相对于跨度的位置,并将 div 放置在其内部的绝对位置。您可以更改 div 上的右/左和顶部/底部值,以相对于跨度移动它。
关于jquery - 使用 jQuery 在鼠标悬停时使用事件处理程序弹出一个弹出框 - 元素跟随鼠标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10754629/