jquery中的工具提示鼠标移动问题

时间:2015-11-11 07:07:21

标签: javascript jquery html css

我在鼠标移动时使用了工具提示。它的工作正常。但我无法访问锚标记元素。鼠标光标不应在工具提示容器内移动。我没有使用任何插件的工具提示。任何人都可以解决这个问题。

$(document).on('mousemove','.showmobileRegfieldDef',function(e){
    var left = e.pageX - $(this).parent().offset().left - 70;
    var top = e.pageY - $(this).parent().offset().top + 300;
    $('#popup-content').css( {
        top: top,
        left: left
    } ); 
});

2 个答案:

答案 0 :(得分:0)

 var tooltips = document.querySelectorAll('.tooltip span');
       window.onmousemove = function (e) {
       var x = (e.clientX + 20) + 'px',
        y = (e.clientY + 20) + 'px';
        for (var i = 0; i < tooltips.length; i++) {
            tooltips[i].style.top = y;
            tooltips[i].style.left = x;
        }
    };

不确定你的问题是什么意思。无论如何试试这个js。它也在锚标签内部工作。 :)

看到这个小提琴。希望我的回答有所帮助谢谢http://jsfiddle.net/JVDFc/

答案 1 :(得分:0)

您无需检查工具提示的客户端位置。 我宁愿这样做:

addTooltip: function(element, text) {
     var tooltip = $("<span>").css({
            position: "absolute",
            display: "none",
            background: "yellow"
        }).addClass("tooltip").text(text);
     $(element).append(tooltip);
     $(element).hover(function(){
         tooltip.css("display", "block"); 
     }, function(){
         tooltip.css("display", "none"); 
     });
},

代码会将工具提示附加到相关元素,如果将鼠标悬停在该元素上则会显示该元素。你现在要做的就是根据你的需要改变CSS,你就完成了