提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  后端

当前栏目

鼠标划过实现延迟加载并隐藏层的js代码

JS代码 实现 加载 隐藏 鼠标 延迟 划过
2023-06-13 09:15:06 时间
复制代码代码如下:

<divid="follow">
<ahref="#"onmouseover="showPlusMobile();"onmouseout="hidePlusMobile();"class="btn">+Follow</a>
<divclass="layer_follow"id="layer_follow"onmouseover="showPlusMobile();"onmouseout="hidePlusMobile();">
<p>这是隐藏层</p>
</div>
</div>

css:
复制代码代码如下:

.layer_follow
{
display:none
}

js:
复制代码代码如下:
varisPlusMobileVisible=false;
varshowTid;
varhideTid;
functionshowPlusMobile(){
if(isPlusMobileVisible==false){
showTid=setTimeout("document.getElementById("layer_follow").style.display="block";isPlusMobileVisible=true;",500);
}else{
clearTimeout(hideTid);
}
}
functionhidePlusMobile(){
if(isPlusMobileVisible==true){
hideTid=setTimeout("document.getElementById("layer_follow").style.display="none";isPlusMobileVisible=false;",500);
}else{
clearTimeout(showTid);
}
}

相关文章