當我將鼠標懸停在其上時，使文本消失

Question

我想讓我的文本消失，並將其懸停在其上方，但我不知道如何。你們能幫我嗎？

這是我的CSS

p:hover { 
    display: none; 
} 

，這是我的html：

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

預先感謝您的幫助！

Answer 1

使要消失有一個特定的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徘徊時，使用.hide();隱藏disappear。當text被隱藏時，disappear使用.show();顯示。

這裏有一個搗鼓它：JSFiddle

Answer 2

給你的「p」標籤分配一個類，然後給這個類：hover屬性，display：none;

HTML: 
I want to be your <p class="disp">girl</p> friend. 

CSS: 
.disp:hover { 
    display: none; 
}