鼠標(biāo)劃過(guò)實(shí)現(xiàn)延遲加載并隱藏層的js代碼
更新時(shí)間：2013年10月11日 16:51:32 作者：
鼠標(biāo)劃過(guò)延遲加載隱藏層的效果，想必大家都有見(jiàn)到過(guò)吧，在本文將為大家詳細(xì)介紹下使用js是如何實(shí)現(xiàn)的，感興趣的朋友可以參考下
復(fù)制代碼 代碼如下:
<div id="follow">
<a href="#" onmouseover="showPlusMobile();" onmouseout="hidePlusMobile();" class="btn">+Follow</a>
<div class="layer_follow" id="layer_follow" onmouseover="showPlusMobile();" onmouseout="hidePlusMobile();">
<p>這是隱藏層</p>
</div>
</div>
css:
復(fù)制代碼 代碼如下:
.layer_follow
{
display:none
}
js:
復(fù)制代碼 代碼如下:
var isPlusMobileVisible=false;
var showTid;
var hideTid;
function showPlusMobile(){
if(isPlusMobileVisible == false) {
showTid = setTimeout("document.getElementById('layer_follow').style.display='block'; isPlusMobileVisible=true;", 500);
}else{
clearTimeout(hideTid);
}
}
function hidePlusMobile(){
if(isPlusMobileVisible == true) {
hideTid = setTimeout("document.getElementById('layer_follow').style.display='none'; isPlusMobileVisible=false;", 500);
}else {
clearTimeout(showTid);
}
}
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)新建文件夾功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
js實(shí)現(xiàn)繼承的方法及優(yōu)缺點(diǎn)總結(jié)
這篇文章主要給大家介紹了關(guān)于js實(shí)現(xiàn)繼承的方法及優(yōu)缺點(diǎn)的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
webpack踩坑系列之less-loader6.0.0的javascriptEnabled報(bào)錯(cuò)問(wèn)題
這篇文章主要介紹了webpack踩坑系列之less-loader6.0.0的javascriptEnabled報(bào)錯(cuò)問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-01-01
javascript滾輪事件基礎(chǔ)實(shí)例講解（37）
這篇文章主要為大家詳細(xì)介紹了javascript滾輪事件基礎(chǔ)實(shí)例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02
JavaScript 動(dòng)態(tài)創(chuàng)建VML的方法
JavaScript 動(dòng)態(tài)創(chuàng)建VML的方法，需要的朋友可以參考下。2009-10-10
這篇文章主要介紹了CORS與預(yù)檢請(qǐng)求，CORS是一套規(guī)范，指導(dǎo)瀏覽器和服務(wù)器之間如何進(jìn)行跨域資源共享，當(dāng)發(fā)送跨域請(qǐng)求時(shí)，瀏覽器會(huì)先發(fā)送一個(gè)OPTIONS方法的預(yù)檢請(qǐng)求。文中介紹的非常詳細(xì)，需要的同學(xué)可以參考一下2023-04-04
JavaScript事件代理（委托）一般用于以下情況：1. 事件注冊(cè)在祖先級(jí)元素上，代理其子級(jí)元素?？梢詼p少事件注冊(cè)數(shù)量，節(jié)約內(nèi)存開(kāi)銷，提高性能。2. 對(duì)js動(dòng)態(tài)添加的子元素可自動(dòng)綁定事件。本文主要介紹用原生 js 實(shí)現(xiàn)該功能。下面跟著小編一起來(lái)看下吧2016-12-12
js去空格想必大家多少都會(huì)點(diǎn)吧，在接下來(lái)的文章中為大家詳細(xì)介紹下如何分別去字符串前后，左邊，右邊空格，感興趣的朋友可以參考下2013-10-10
這篇文章主要給大家介紹了關(guān)于原生js中運(yùn)算符及流程控制的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
Bootstrap.css與layDate日期選擇樣式起沖突的解決辦法
這篇文章主要為大家詳細(xì)介紹了BootStrap.css與layDate日期選擇樣式起沖突的解決辦法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04