将鼠标悬停在文本后，文字会消失

Question

我想让我的文字消失，当我将鼠标悬停在它上面时将其保留，但我不知道如何。你能帮助我吗？

这是我的CSS

p:hover {
    display: none;
}

这是我的HTML：

I want to be your <p>girl</p>friend.

提前感谢您的帮助！

Answer 1

为您的＆＃34; p＆＃34;分配课程tag然后给出类：hover属性，display：none;

**Microsoft Windows [Version 6.3.9600]**

**(c) 2013 Microsoft Corporation. All rights reserved.**

Answer 2

使您想要消失的文本具有特定ID，外部文本也具有特定文本。：

<p id="text">I want to be your <span id="disappear">girl</span>friend.</p>

单独使用CSS不适用于此，因为一旦您将元素悬停以使其消失，它将不再悬停并且将再次出现。这将导致它不断闪烁。所以为此，我们需要一些Javascript：

var disappear = $("#disappear");
$("#text").hover(function(){
    disappear.hide();
}, function() {
    disappear.show();
});

此Javascript将disappear元素存储为对象。然后它等待text元素悬停并“未覆盖”（第一个参数用于悬停，第二个用于“取消悬停”）。当text悬停时，使用disappear隐藏.hide();。取消text后，disappear会显示.show();。

这是一个小提琴：JSFiddle