忽略悬停的对象

我有一个带变换比例和旋转的背景图像。所以，只要你把光标放在它上面，它就会旋转15deg并且缩放2。忽略悬停的对象

我想把我的logo放在它上面，但是我怎么做到这一点，所以只要我把光标放在logo上，它仍然会像我一样徘徊在背景？ CSS：

.background-image:hover { 
    position: fixed; 
    right: 0px; 
    right: 0px; 
    z-index: -999; 
    display: block; 
    background-image: url("whatever.jpg"); 
    width: 100%; 
    height: 100%; 

    -webkit-filter: blur(8px); 
    -moz-filter: blur(8px); 
    -o-filter: blur(8px); 
    -ms-filter: blur(8px); 
    filter: blur(8px); 

    transform: rotate(12deg) scale(2); 
    -o-transform: rotate(12deg) scale(2); 
    -moz-transform: rotate(12deg) scale(2); 
    -webkit-transform: rotate(12deg) scale(2); 

    transition: all 0.3s ease-in-out 0s; 
}

这里我有一个div在背景上，如果我认为我的光标放在DIV的背景悬停已经不指望并退回。我如何让div仍然可见，当我将鼠标悬停在div上时，背景将会恢复？ CSS为div：

<div class="logo-position"></div> 

.logo-position { 
    position: relative; 
    width: 800px; 
    height: 600px; 
    padding: 0; 
    margin-right: auto; 
    margin-left: auto; 
    background-color: white; 
    top: 80px; 
}

div的“hitbox”也很奇怪。我可以将光标移到div的右侧，它仍然会计数，因为背景变换返回时，我的光标在div内。有人看到我做错了什么吗？

来源

2017-08-08 Han Heine

将pointer-events: none;加到.logo-position类。这应该会导致徽标忽略悬停事件并让它通过。请注意，它将忽略所有事件，因此它也不会被点击。

来源

2017-08-08 15:45:28 sn3ll

这工作表示感谢，我只需要删除边距，并添加了一个浮动：左侧，它的工作，我只是将它与父div的位置 –

如果.logo-position div是.background-image div的孩子，它将允许将悬停应用于徽标。

来源

2017-08-08 15:53:48

也是一个很好的观点。 – sn3ll

问题在于徽标会变得模糊不清，但我不希望发生这种情况 –

啊，是的。 -_- –

忽略悬停的对象

回答

相关问题