让jQuery mousemove停止

此时覆盖div总是显示出来。但是我只希望它在鼠标在图表中传递一个值时显示。方法d3.event.pageX和d3.event.pageY将不起作用。该代码只是一个更大的页面的片段，并且不知何故使用d3方法时不会跟踪鼠标的位置。让jQuery mousemove停止

下面是代码的小提琴：http://jsfiddle.net/9z6nmwff/

下面是代码片段：

//draw the scatterplot 
svg.selectAll("dot")          
    .data(data)            
    .enter().append("circle")         
    .attr("r", 5)  
    .attr("cx", function(d) { return x(d.date); })   
    .attr("cy", function(d) { return y(d.open); }) 
    // Tooltip stuff after this 
    .on("mouseover", function(d) {   

      //console.log("x: " + d.pageX + ", y: " + d3.event.pageY); 
      $(document).mousemove(function(event){ 
      console.log("x: " + event.pageX + ", y: " + event.pageY); 
      div.transition() 
      .duration(200)  
      .style("opacity", 0); 
      div.transition() 
      .duration(200)  
      .style("opacity", .9); 
      div.html(formatTime(d.date) + "<BR>" +d.open)  
      .style("left", (event.pageX) + "px")    
      .style("top", (event.pageY) + "px"); 
      //$("span").text("X: " + event.pageX + ", Y: " + event.pageY); 
     }); 
     });

我怎样才能做到这一点？

编辑：以下是我当前解决方案的代码。感谢您的帮助！

// Tooltip stuff after this 
.on("mouseover", function (d) { 

    $(document).ready(function(){ 
      $(".clearfix").mousemove(function(event){ 

     div.transition() 
      .duration(200) 
      .style("opacity", 0); 
     div.transition() 
      .duration(200) 
      .style("opacity", .9); 
     div.html(formatTime(d.date) + "<BR>" + d.open) 
      .style("left", (event.pageX+3) + "px") 
      .style("top", (event.pageY+3) + "px"); 
}); 
    $(".clearfix").mouseleave(function(){ 
     div.transition() 
      .duration(200) 
      .style("opacity", 0); 
     }); 
    }); 
});

来源

2014-09-29 sanyooh

你能解决您的小提琴？将js放入CSS中的js css和html中的html中 – Alexandros 2014-09-29 11:30:34

可以使用mouseleave做隐藏，让mouseenter做展示类似于你现在做的

// Tooltip stuff after this 
    .on("mouseover", function (d) { 
      div.transition() 
       .duration(200) 
       .style("opacity", 0); 
      div.transition() 
       .duration(200) 
       .style("opacity", .9); 
      div.html(formatTime(d.date) + "<BR>" + d.open) 
       .style("left", (event.pageX) + "px") 
       .style("top", (event.pageY) + "px"); 

    }).on("mouseleave", function (d) { 
      div.transition() 
       .duration(200) 
       .style("opacity", 0); 
    });

小提琴http://fiddle.jshell.net/leighking2/277yknrs/

来源

2014-09-29 11:34:08 Quince

让jQuery mousemove停止

回答

相关问题