Question

你好吗？

我是jQuery的完全初学者，我在父元素上使用mousemove事件，我基于div逐渐淡出cursor's position，但问题是我面临的是，当child div出现时，我正在徘徊child div mousemove不会发射，同时它会为每个其他孩子开火。任何帮助表示赞赏。

HTML代码：

<table class="maintable">

<div class="large"></div>

    <tr>
        <td >

            <img class="enlargeimg" src="" />

        </td >
    </tr>

</table>

CSS：

* {margin: 0; padding: 0;}

.maintable {width: 400px; height:400px; 
margin: 50px auto; 
position: relative; 
background-color: blue; padding: 30px;}

.large {
    width: 175px; height: 175px;
    position: absolute;

    z-index:5;

    box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85), 
    0 0 7px 7px rgba(0, 0, 0, 0.25), 
    inset 0 0 40px 2px rgba(0, 0, 0, 0.25);





    display: none;
}

.maintable img { width:200px; height: 200px; display: block; background-color: red; }

Jquery代码：

$('table.maintable').on('mousemove' , function(e){

$(".large").css({
        left: e.pageX - $(".large").width()/2,
        top: e.pageY  - $(".large").height()/2
}).fadeIn();

});

Here is a fiddle

Answer 1

看一下css属性指针事件。如果将其设置为none，则所有鼠标事件都将传递给基础元素。

在您的情况下，它将被添加到.large样式：

.large {
    pointer-events:none;
}

有关详细信息，请查看https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

这是一个更新的小提琴： http://jsfiddle.net/boleary/dnae98w1/

jQuery - 需要帮助 - mousemove事件

1 个答案: