我正在尝试创建一个小div,它会在特定元素悬停时出现。我还想使用随客户端移动鼠标而改变的鼠标坐标来偏移div的位置。
我的猜测是计算这个并返回div的新值是昂贵的,耗尽资源看到div的运动错开。
有谁知道如何提高这种方法的效率?
我使用了具有良好跟踪功能的tooltip plugin,并且非常顺利地移动了元素。
我的js;
$(document).ready(function(){
$('#utilities').mouseover(function(event) {
var left = event.pageX - $(this).offset().left + 100;
var top = event.pageY - $(this).offset().top + 130;
$('#gas-electric-hover').css({top: top,left: left}).show();
//console.log (left, top);
});
$('#utilities').mouseout(function() {
$('#gas-electric-hover').hide();
});
});
我也创建了这个jsfiddle。事实上,本地代码是惊人的,但是当鼠标进入并离开目标div时,jsfiddle似乎只是更新了coords。
任何帮助非常感谢。
答案 0 :(得分:14)
我想你想要像鼠标一样移动
$(document).ready(function(){
$('#utilities').mousemove(function(event) {
var left = event.pageX - $(this).offset().left + 100;
var top = event.pageY - $(this).offset().top + 130;
$('#gas-electric-hover').css({top: top,left: left}).show();
//console.log (left, top);
});
$('#utilities').mouseout(function() {
$('#gas-electric-hover').hide();
});
});
检查此更新 jsFiddle