悬停div，但不悬停在主div之外的div，因为位置:绝对。

Question

我想显示这个‘取消选择’按钮在悬停的图像，但不是在悬停在图像下的恒星，在图像-div。(绝对，底部：-20)

以下是HTML代码：

<div class="image-wrapper">
 <div class="stars"></div>
 <div class="deselect">deselect</div>
</div>

我不想把星星放在.image-wrapper的下面/外面！

这不管用：

$('.image-wrapper:not(.stars)').hover(

function () {
    $(this).find(".deselect").show();
},

function () {
    $(this).find(".deselect").hide();
});

Answer 1

尝试添加您的css：

.stars { pointer-events:none;}

Answer 2

如果您需要使用jquery，这个脚本可能会有所帮助。

演示

$(document).ready(function() {
    $(".deselect").css({"display":"block"});
    $(".image-wrapper").bind({
        mouseenter: function(){
            $(".deselect").css({
                "background":"red"
            });
        },
        mouseleave: function(){
            $(".deselect").css({
                "background":"inherit"
            });
        }
    });
});