悬停太慢
悬停太慢
提问于 2012-12-22 00:48:12
由于jQuery的hover()函数，我在拉斐尔画布上得到了一些遗留下来的文本。我基本上希望当我将鼠标悬停在圆圈上时显示文本，然后保证一旦停止悬停在圆圈上它就会消失(hoverOut())。
正如您在下面看到的，我尝试删除hoverOut()上的文本()，但它没有完成这项工作。然而，它可以很好地删除矩形。是否与get()请求占用太多时间有关？
node = paper.circle(value.xpos_init, value.ypos_init, node_rad).attr({"fill": "#ff0000"})
.hover(function(e){
posx = e.pageX - $('#canvas').offset().left;
posy = e.pageY - $('#canvas').offset().top;
createMenu(posx,posy,"10");
},
function(){
menu.remove();
menu_deg_cent_text.remove();
});
function createMenu(x,y,id_in)
{
menu_x = 100;
menu_y = 60;
menu = paper.rect(x,y,menu_x,menu_y).attr({"fill":"white","stroke":"red"});
$.get("../php/text.php", {id : id_in},
function(data){
menu_deg_cent_text = paper.text(x+(menu_x/2),y+(menu_y/2),"test_text");
});
}回答 1
Stack Overflow用户
回答已采纳
发布于 2012-12-22 02:05:18
我强烈推荐使用原生Javascript，而不是使用Raphael来制作工具提示框。浮动元素可以更好地处理样式和文本换行之类的事情。
node = paper.circle(100, 100, 50).attr({"fill": "#ff0000"})
.hover(function(e) {
//if you want to calculate position by mouse
//posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
//posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop-15;
posx = this.attr('cx');
posy = this.attr('cy') - this.attr('r');
document.getElementById("tip").style.top = posy + "px";
document.getElementById("tip").style.left = posx + "px";
document.getElementById("tip").style.display = "block";
}, function(e) {
document.getElementById("tip").style.display = "none";
});工作演示：http://jsfiddle.net/jLSUa/1/
至于将AJAX调用放在mouseover事件中:看起来非常不明智。你能提前加载鼠标悬停文本吗？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13994031
复制相关文章
相似问题
腾讯云开发者
