optionSearch();
function optionSearch() {
//定义一个清除计时器的变量
var timer = null; //自选标题区域
$("#optional-title th").hover( function(){
//第一步首先清楚一遍计时器
clearInterval(timer);
//鼠标经过内容显示
$("#optional-search").slideDown();
}, function(){
//鼠标离开的时候计时器五秒后隐藏内容
timer = setInterval(function(){
$("#optional-search").slideUp();
}, 5000); }); //自选搜所区域
$("#optional-search").hover(function(){
//鼠标进入搜索区域, 显示该区域并清除计时器
$(this).show();
clearInterval(timer); }, function(){
// 鼠标离开该区域执行计时器
timer = setInterval(function(){
$("#optional-search").slideUp("");
}, 5000);
});
}
注释 
功能很简单, 鼠标移到标题显示搜索框, 鼠标离开后 5s后隐藏。 鼠标移动搜索区域,显示该区域,离开该区域 5s后隐藏
代码写的有点啰嗦, 但没想好怎么优化,晚上回家考虑考虑下

  

JS中关于 一个关于计时器功能效果的实现的更多相关文章

  1. php中向前台js中传送一个二维数组

    在php中向前台js中传送一个二维数组,并在前台js接收获取其中值的全过程方法: (1),方法说明:现在后台将数组发送到前台 echo json_encode($result); 然后再在js页面中的 ...

  2. js中关于一个数组中最大、最小值以及它们的下标的输出的一种解决办法

    今天在学习js中的数组时,遇到的输出一个数组中最大.最小值以及它们的下表,以下是自己的解决方法! <script type="text/javascript"> var ...

  3. jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?

    1 jquery ajax中支持哪些返回类型在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get(). 预期服务器返回的数据类型.如果不指定,jQuery 将自 ...

  4. Js中的一个日期处理格式化函数

    由于在工作中,经常需要对日期进行格式化,不像后端那样,有方便的方法可调用,可以在date的对象prototype中定义一个format方法,见如下 //日期时间原型增加格式化方法 Date.proto ...

  5. 常见面试算法题JS实现-设计一个有getMin功能的栈

    前言: 已经确定工作了-下周一正式入职,按理说应该是可以好好浪荡一周的,但是内心总是不安,总觉得自己这个水平真的太菜了,还是趁着现在有自己的时间,赶紧多看看书,多学习学习吧orz所以把之前校招买的书, ...

  6. JS中部分不常用小功能记录

    1.serializeArray()在表单中使用,必须在form标签中,需要手机的元素要有name属性.源生JS将对象转成json   resulrMK = JSON.stringify(resulr ...

  7. 如果在vue中实现一个输入框的抖动效果?

    1. 先来理下思路? 1)抖动就是摆动,现实中的钟摆可以很形象. 2)当摆动到临界点后,就会向相反的方向摆动. 3)在没有动力时,摆动会慢慢停止. 2.用法: :start.sync 里面是抖动器名字 ...

  8. js中的一个方法怎么将数据主动传给另一个方法

    项目有这样的一个需求,一个不断接收实时数据的有返回值的js方法Function A在运行,同时我想将接收到的这些数据进行分解提取想要的部分并传给Function B.如何实现? Function A( ...

  9. JS中判断一个数组是否有相同数据的

    页面中有多个<select> $("select").each(function(){ str.push($(this).val());}); // join() 方法 ...

随机推荐

  1. ajax中基本兼容各浏览器的XMLHttpRequest的创建

    function createXHR(){ var xhr = null; if(window.XMLHttpRequest){//判断当前浏览器是否支持XMLHttpRequest xhr = ne ...

  2. css制作简单的导航栏

    //css代码 #menu{ height: 65px; width:100%; background-color: rgba(0, 0, 0, 0.5);}#menu ul{ list-style: ...

  3. java 零碎1

    1. java 程序的入口必须是 static 类型的,接口中不允许有 static , 而且接口中的方法必须是public. 2. java 回收主要针对的是堆区的回收. 3. java.exe 是 ...

  4. js用ajax和不同页面的php互相传值的方法

    js里的代码:<script> var json; //获取所有class名为zhi的标签 var zhi = document.getElementsByClassName('zhi') ...

  5. J2EE相关总结

    Java Commons The Java™ Tutorials: http://docs.oracle.com/javase/tutorial/index.html Java Platform, E ...

  6. [maven] 使用问题及思考汇总

    (1)Maven坐标 maven坐标可以唯一标识一个项目,包含四个元素 groupId , artifactId, packaging, version. groupId:一般为团体,公司,项目.如 ...

  7. 实验二Step1-有序顺序表

    #include<stdio.h> struct job { ];//作业名称 char status;//当前状态 int arrtime;//到达时间 int reqtime;//要求 ...

  8. cd命令进入D盘

    CD命令是更改目录命令如果要进入D盘 不用这个命令 直接输入 D: 回车 即可要是你非要使用CD命令那要加参数/DCD D:系统只是认为你想在系统中记忆一下D盘所以还是返回原先目录例:D盘下有一个目录 ...

  9. 生成json对象

    JSONObject 对于放入的object,最终生成的json是什么样的? 两个JavaBean: public class ClassBean { private int grade; priva ...

  10. OLAP 模型

    OLAP分析的基础是多维数据集,按照其数据存储格式的不同可以分为关系型OLAP(Relational OLAP,ROLAP)和多维型OLAP(Multidimensional OLAP,MOLAP). ...