如果需要在滑鼠經過時顯示文字或某物件，可以用CSS來簡單達成，只要在CSS中加上:hover再指定經過時要做什麼即可。
HTML＋CSS
<style>
.box {
position: relative;
}
.box:hover::before {
position: absolute;
top: -50px;
left: 0;
content: '你看到我啦(・ω・)ノ';
}
</style>
<div class="box">請將游標移到這裡</div>
實際操作
See the Pen hover show CSS by kumo (@kumo-tw) on CodePen.
說明
CSS中的hover是用來控制游標經過的效果，只要在需要顯示文字的元素物件加上:hover即代表游標經過該物件時的反應，而::before代表的是在物件之前產生，如果要在之後產生則是用::after，不過這裡因為已經控制位置，因此用哪個都不影響結果，接著只要用content就可以自訂要顯示的文字。
CSS的方法有很多，不一定只能用content來顯示文字，也可以另外再設一個div，再透過display控制關閉與顯示，例如要顯示文字的部分預設是display:none;，再用CSS的:hover 並在{}中寫上display:block表示滑鼠經過時顯示此物件。
實際操作（display 版）
See the Pen hover show display CSS by kumo (@kumo-tw) on CodePen.
本文是否對您有幫助？