您的位置：首页 > 编程技术 > js  >  鼠标划过实现延迟加载并隐藏层的js代码

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

 更新时间：2013年10月13日 07:27  点击：3549

 代码如下:


<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);
}
}

[!--infotagslink--]

相关文章

  • 写得不错的jquery table鼠标经过变色代码

    代码如下:$(&#39;#<%=AllEvent.ClientID%> tr:not(:has("th"))&#39;).hover(function () { $bg = $(this).css(&#39;background-color&#39;); $(this).css(&#39;background-...2013-10-03

  • 用js的document.write输出的广告无阻塞加载的方法

    一、广告代码分析很多第三方的广告系统都是使用document.write来加载广告，如下面的一个javascript的广告链接。复制代码 代码如下:<script type="text/javascript" src="http://gg.5173.com/adpolestar/5173/;ap=2EBE5...2014-06-07

  • jQuery页面加载初始化常用的三种方法

    当页面打开时我们需要执行一些操作,这个时候如果我们选择使用jquery的话,需要重写他的3中方法,自我感觉没什么区 别,看个人喜好了,第二种感觉比较简单明了: 第一种: 复制代码 代码如下: <script type="text/javas...2014-06-07

  • 解决IDEA插件市场Plugins无法加载的问题

    这篇文章主要介绍了解决IDEA插件市场Plugins无法加载的问题,本文通过图文并茂的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2020-10-21

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

    鼠标划过实现延迟加载并隐藏层的js代码...2013-10-13

  • Android WebView加载html5页面实例教程

    如果我们要在Android应用APP中加载html5页面，我们可以使用WebView，本文我们分享两个WebView加载html5页面实例应用。 实例一：WebView加载html5实现炫酷引导页面大多...2016-09-20

  • Angular性能优化之第三方组件和懒加载技术

    这篇文章主要介绍了Angular性能优化之第三方组件和懒加载技术，对性能优化感兴趣的同学，可以参考下...2021-05-11

  • 解决vue动态路由异步加载import组件,加载不到module的问题

    这篇文章主要介绍了解决vue动态路由异步加载import组件,加载不到module的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧...2020-07-27

  • vue3如何按需加载第三方组件库详解

    距离 Vue 3.0 正式版发布已经有一段时间了,关于vue3组件库相关的问题还是挺多人感兴趣的,这篇文章主要给大家介绍了关于vue3如何按需加载第三方组件库的相关资料,需要的朋友可以参考下...2021-06-02

  • 几种延迟加载JS代码的方法加快网页的访问速度

    本文介绍了如何延迟javascript代码的加载，加快网页的访问速度。 当一个网站有很多js代码要加载，js代码放置的位置在一定程度上将会影像网页的加载速度，为了让我们的网页加载速度更快，本文总结了一下几个注意点...2013-10-13

  • MYSQL主从不同步延迟原理分析及解决方案

    1. MySQL数据库主从同步延迟原理。要说延时原理，得从mysql的数据库主从复制原理说起，mysql的主从复制都是单线程的操作，主库对所有DDL和DML产生binlog，binlog是顺序写，所以效率很高，slave的Slave_IO_Running线程到主库取日...2013-10-04

  • C#模拟window操作鼠标的方法

    这篇文章主要介绍了C#模拟window操作鼠标的方法,可实现模拟鼠标移动到固定位置后点击右键的功能,涉及鼠标常用事件的操作技巧,需要的朋友可以参考下...2020-06-25

  • ThinkPHP+jquery实现“加载更多”功能代码

    本篇文章主要介绍了ThinkPHP+jquery实现“加载更多”功能代码，以实例代码讲诉了加载更多的代码实现,非常具有实用价值,需要的朋友可以参考下 ...2017-03-13

  • AngularJS 实现按需异步加载实例代码

    AngularJS 通过路由支持多视图应用， 可以根据路由动态加载所需的视图， 在 AngularJS 的文档中有详细的介绍， 网上也有不少教程， 就不用介绍了！随着视图的不断增加，js文件会越来越多，而 AngularJS 默认需要把全部的js都一次性...2015-10-21

  • 基于JavaScript获取鼠标位置的各种方法

    这篇文章主要介绍了基于JavaScript获取鼠标位置的各种方法 ,需要的朋友可以参考下...2015-12-18

  • JS实现网页游戏中滑块响应鼠标点击移动效果

    本文实例讲述了JS实现网页游戏中滑块响应鼠标点击移动效果。分享给大家供大家参考，具体如下：这是网页游戏中的一个有趣效果，可以完成以下几个动作：滚动、scroll 8个方向、鼠标坐标获娶对象上下左右位置获取，大家可以自己添...2015-10-21

  • C#获取鼠标在listview右键点击单元格的内容方法

    下面小编就为大家带来一篇C#获取鼠标在listview右键点击单元格的内容方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2020-06-25

  • 用C++面向对象的方式动态加载so的方法

    下面小编就为大家带来一篇用C++面向对象的方式动态加载so的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2020-04-25

  • jQuery Easyui使用（二）之可折叠面板动态加载无效果的解决方法

    这篇文章主要介绍了jQuery Easyui使用之可折叠面板动态加载无效果的解决方案，非常不错，具有参考借鉴价值，感兴趣的朋友一起看下吧...2016-08-24

  • C#实现程序等待延迟执行的方法

    这篇文章主要介绍了C#实现程序等待延迟执行的方法,涉及C#动态链接库的使用及延迟的实现技巧,需要的朋友可以参考下...2020-06-25