當我懸停特定元素時，我試圖讓元素出現，但我不知道選擇哪種方法。我的專案只包含 html、css 和 javascript。
我希望當用戶懸停業務規則時（如圖所示），其他氣泡的不透明度降低，新的氣泡出現在懸停的周圍。我是否應該使用 js 觀察者添加一個類來降低其他氣泡的不透明度和一個設定可見新氣泡的類？我的主要問題是我還沒有找到一種方法來觸發觀察者的焦點。
uj5u.com熱心網友回復：
你可以用你將在大氣泡上設定的事件mouseenter來做所有事情。mouseleavediv
初始狀態是所有大氣泡都large-bubble具有正常不透明度的類，而大氣泡周圍的小氣泡small-bubble具有display: none.
向大氣泡添加
mouseenter和事件偵聽器mouseleave在 上
mouseenter，做類似的事情document.getElementsByClassName('.large-bubble')并應用不同的不透明度。添加一個類，它將取消設定當前懸停的氣泡的不透明度。然后得到所有屬于大氣泡的小氣泡并去除display: none。On
mouseleave，將所有內容重置為初始狀態。
uj5u.com熱心網友回復：
有很多方法，這是很簡單的方法。在這種方法中，您不需要 JavaScript Dom 操作來執行此操作。
為了做到這一點，你需要有這種元素，
<div class="wrapper">
<div class="bussiness_rules"></div>
</div>
<div class="other_bubbles"></div>
Wrapper 充當業務氣泡和其他氣泡的父級。因此，您可以在 bussiness_rules 氣泡 div 內設計業務規則氣泡。（為了代碼的簡單性，我沒有設計它）。那么您的要求是在懸停業務氣泡時，您的其他氣泡應該顯示。所以在下面規則定義的css檔案中，
.other_bubbles{
display:none;
}
.wrapper:hover ~ .other_bubbles {
display:block;
}
這樣當您懸停包裝時，將顯示您的其他氣泡。為了做到這一點，您的其他氣泡應在開始時將其設定為不顯示。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/527391.html
上一篇：div定位在另一個行內的正下方