立即注冊 找回密碼

QQ登錄

只需一步,快速開始

關(guān)于鼠標(biāo)移動在文字上面,讓其顯示詳細信息的代碼方法

2017-11-20 23:09| 發(fā)布者: 大師兄| 查看: 659| 評論: 0

摘要: 今天小編收到一個客戶這樣的提問,我將鼠標(biāo)移動在一段文字上面,然后顯示一段文字的詳細信息,該怎么實現(xiàn)呢,小編推薦了如下的代碼,可以直接用來使用哦把下面的代碼保存成一個html文件,用瀏覽器打開試試:scriptfu ...
今天小編收到一個客戶這樣的提問,我將鼠標(biāo)移動在一段文字上面,然后顯示一段文字的詳細信息,該怎么實現(xiàn)呢,
小編推薦了如下的代碼,可以直接用來使用哦
把下面的代碼保存成一個html文件,用瀏覽器打開試試: 
<script>
function showTooltip(target) {
document.getElementById(target.id.replace(/^label/,'tooltip')).style.display = 'block';
}
function hideTooltip(target) {
document.getElementById(target.id.replace(/^label/,'tooltip')).style.display = 'none';
}
</script>

<label onmouseover='showTooltip(this);' onmouseout='hideTooltip(this);' id='label0'>把鼠標(biāo)移到我上面看看...</label>
<div id='tooltip0' style='display:none;border:1px solid gray;background-color:yellow;color:blue;'><p>這是一段文字的詳細信息。。。</p></div>


這樣就可以了,當(dāng)然我們也可以利用title來實現(xiàn),大家可以參考如下內(nèi)容

鮮花

握手

雷人

路過

雞蛋

最新評論

相關(guān)推薦
!jz_fbzt! !jz_lxwm! !jz_gfqqq!

關(guān)于我們|手機版|小黑屋|地圖|【道勤網(wǎng)】-bmrsportswear.com 軟件視頻自學(xué)教程|免費教程|自學(xué)電腦|3D教程|平面教程|影視動畫教程|辦公教程|機械設(shè)計教程|網(wǎng)站設(shè)計教程【道勤網(wǎng)】 ( 皖I(lǐng)CP備15000319號-1 )

GMT+8, 2024-10-23 09:41

Powered by DaoQin! X3.4 © 2016-2063 Dao Qin & 道勤科技

返回頂部