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


Posted in Javascript onOctober 11, 2013
<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:
.layer_follow 
{ 
display:none 
}

js:
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); 
} 
}
Javascript 相关文章推荐
讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别
Apr 12 Javascript
Javascript添加监听与删除监听用法详解
Dec 19 Javascript
jQuery表格插件datatables用法详解
Nov 23 Javascript
30分钟快速掌握Bootstrap框架
May 24 Javascript
Angular1.x复杂指令实例详解
Mar 01 Javascript
webpack配置的最佳实践分享
Apr 21 Javascript
Express本地测试HTTPS的示例代码
Jun 06 Javascript
从零开始实现Vue简单的Toast插件
Dec 03 Javascript
实例讲解React 组件生命周期
Jul 08 Javascript
通过实例解析JavaScript常用排序算法
Sep 02 Javascript
vue中jsonp插件的使用方法示例
Sep 10 Javascript
vue常用高阶函数及综合实例
Feb 25 Vue.js
javascript自然分类法算法实现代码
Oct 11 #Javascript
jQuery阻止事件冒泡具体实现
Oct 11 #Javascript
JS定时器实例详细分析
Oct 11 #Javascript
jquery 清空file域示例(兼容个浏览器)
Oct 11 #Javascript
jquery左右滚动焦点图banner图片鼠标经过显示上下页按钮
Oct 11 #Javascript
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
Oct 11 #Javascript
Js base64 加密解密介绍
Oct 11 #Javascript
You might like
用PHP书写安全的脚本代码
2012/02/05 PHP
PHP中使用foreach()遍历二维数组的简单实例
2016/06/13 PHP
Windows平台实现PHP连接SQL Server2008的方法
2017/07/26 PHP
[全兼容哦]--实用、简洁、炫酷的页面转入效果loing
2007/05/07 Javascript
关于Mozilla浏览器不支持innerText的解决办法
2011/01/01 Javascript
如何使用Jquery获取Form表单中被选中的radio值
2013/08/09 Javascript
jQuery ajax dataType值为text json探索分享
2013/09/23 Javascript
javascript设置金额样式转换保留两位小数示例代码
2013/12/04 Javascript
jQuery针对各类元素操作基础教程
2014/08/29 Javascript
Highcharts入门之简介
2016/08/02 Javascript
Angularjs 动态改变title标题(兼容ios)
2016/12/29 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
2017/04/05 Javascript
JS解决IOS中拍照图片预览旋转90度BUG的问题
2017/09/13 Javascript
Angular4 ElementRef的应用
2018/02/26 Javascript
vue之浏览器存储方法封装实例
2018/03/15 Javascript
jquery分页插件pagination使用教程
2018/10/23 jQuery
微信小程序使用map组件实现解析经纬度功能示例
2019/01/22 Javascript
使用vue-router切换页面时,获取上一页url以及当前页面url的方法
2019/05/06 Javascript
vue组件 keep-alive 和 transition 使用详解
2019/10/11 Javascript
Python使用PyCrypto实现AES加密功能示例
2017/05/22 Python
ubuntu上安装python的实例方法
2019/09/30 Python
pytorch中的卷积和池化计算方式详解
2020/01/03 Python
html5 Canvas实现图片旋转的示例
2018/01/15 HTML / CSS
Html5之webcoekt播放JPEG图片流
2020/09/22 HTML / CSS
html5跳转小程序wx-open-launch-weapp踩坑
2020/12/02 HTML / CSS
美国最大的城市服装和运动鞋零售商:Jimmy Jazz
2016/11/19 全球购物
意大利在线眼镜精品店:Ottica Lipari
2019/11/11 全球购物
物流专业大学应届生求职信
2013/11/03 职场文书
计算机专业毕业生求职信
2014/04/30 职场文书
校园演讲稿汇总
2014/05/21 职场文书
婚礼庆典答谢词
2015/01/20 职场文书
初中政教处工作总结
2015/08/12 职场文书
行为规范主题班会
2015/08/13 职场文书
行为习惯主题班会
2015/08/14 职场文书
springboot中的pom文件 project报错问题
2022/01/18 Java/Android
微软团队与 NASA 科学家和惠普企业(HPE)的工程师合作
2022/04/21 数码科技