Question

有人能给我一个如何解决这个问题的提示吗？

看看带有旗帜的......下面的部分。在该区域鼠标悬停是可见的..但它在标志上消失 - 这是我想要删除的东西。它应该保持可见。

但请记住，这是一个非常简单的例子。在真实的我有很多区域和旗帜。 ; O）

jQuery(document).ready(function($) {
    // add div for showing dates
    $('body').append('<div id="mo_termin"></div>');
    // show div on mouseover
    $('area').mouseover(function(event) { 
        var left = event.pageX + 30;
            var top = event.pageY + 5;
            display = '<div class="views-field-field-body">Keine Termine</div>';
        $('#mo_termin').css({top: top,left: left}).html(display).show();
    });
    $('area').mouseout(function() {
        $('#mo_termin').html('').hide();
    });
});

Answer 1

您也可以使用css属性pointer-events: none;。

#karte .flag {
      pointer-events: none; /*Added line*/
    position: absolute;
    background: url('http://static.netzwelt.de/farcade/images/capturetheflag1.gif') no-repeat;
    width: 50px;
    height: 50px;
    top: 200px;
    left: 50px;
}

以下是演示http://jsfiddle.net/9Br6h/2/。

Answer 2

假设该标志完全覆盖其下方的“悬停”区域，您可以修改代码，以便设置mouseover事件的行如下所示：

// show div on mouseover
$('area, .flag').mouseover(function(event) {

以下是一个示例：http://jsfiddle.net/9Br6h/1/

覆盖div的图像映射：鼠标悬停消失在div上

2 个答案: