mouseenter和mouseout中间的时间控制
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8>
<title></title> </head>
<body> <div id="test" style="border: 1px solid #CCC; width: 100px; height: 100px; background: #666;">这是一个测试DIV
把鼠标放在上面2秒后会弹出他的ID</div>
<script type="text/javascript">
// <![CDATA[
var delay=function(t,fn){
var i=0,
j=10,
t=(t*1000)/j,
//把延迟时间平均分成10等份
_this=this,
//解决this绑定问题,所以调用delay函数的时候,请处理好this指向本身对象
d=setInterval(function(){
i++;
if(i==j){
clearInterval(d);
fn.apply(_this);
};
},t); _this.onmouseout=function(){
clearInterval(d);
}; }
document.getElementById("test").onmouseover=function(){
delay.apply(this,[2,function(){
alert(this.id)
}]);
//使用apply改变this指针
};
// ]]>
</script> </body>
</html>
$(".a").each(function(i) {
$(this).mouseenter(function(){
t=setTimeout("$('.div').eq("+i+").fadeIn()",500)
}).mouseleave(function(){
clearTimeout(t)
$(".div").eq(i).fadeOut();
}) });
不知道当时为啥会想得那么复杂 :
$(".list").mouseenter(function() {
if( $(this).data("time") ){
clearInterval( $(this).data("time") );
}
var _this = $(this);
$(this).data("time", setInterval(function(){
_this.children(".cover").animate({top: '0px'});
clearInterval( _this.data("time") );
_this.removeData("time");
},300));
}).mouseleave(function() {
if( $(this).data("time") ){
clearInterval( $(this).data("time") );
$(this).removeData("time");
}
$(this).children(".cover").animate({top: '145px'});
})
--------------------------------------------------------------------------setTimeout加参数20130805
var _sto = setTimeout;
window.setTimeout = function(callback,timeout,param)
{
var args = Array.prototype.slice.call(arguments,2);
var _cb = function()
{
callback.apply(null,args);
}
_sto(_cb,timeout);
}
--------------------------------------------------------------------------setTimeout加参数20130805
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8>
<title>And the winner isn't...</title>
<style type="text/css">
a{width:100px; height:100px; background:#0FF; display: block; position:absolute}
.div{ width:100px; height:100px; background:#f36; display:none; position:absolute}
.warp{width:100px; height:100px; float:left; position:relative; margin:20px}
</style>
<script src="scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".warp").each(function(i) {
$(this).mouseenter(function(){
t=setTimeout("$('.div').eq("+i+").fadeIn()",500)
}).mouseleave(function(){
clearTimeout(t)
$(".div").eq(i).fadeOut();
}) });
})
</script>
</head>
<body>
<div class="warp" style=" ">
<a href="#"></a>
<div class="div"></div>
</div>
<div class="warp">
<a href="#"></a>
<div class="div" style=""></div>
</div>
<div class="warp">
<a href="#"></a>
<div class="div" style=""></div>
</div> </body>
</html>
mouseenter和mouseout中间的时间控制的更多相关文章
- Tuxedo 超时时间控制(转贴)
以下是转贴: TUXEDO超时控制全功略 摘要: 本<功略>集中了TUXEDO应用中,可能涉及到的所有时间参数,并分别对其进行详细描述,不但对其出处.取值等基本属性进行查证,而且,通过分析 ...
- 关于JS的时间控制实现动态效果及实例操作
关于JS的时间控制 <script> BOM //Bowers Object Model 浏览器对象模型 setTimeout()// 延迟执行一次 ...
- Quartz定时器中Cron时间控制表达式写法
Quartz定时器中Cron时间控制表达式写法: 1.表示形式 该表达式简洁简单,总共有7个空格分割的表达子式,形式为[* * * * * * *],而这七个位置上的东西表达方式有很多,意义从左往 ...
- Linux带有时间控制的多进程bash脚本
目标 以可控制的多进程执行,达到最大执行时长后停止脚本. 思路 1.产生fifo管道,并预填充n个值(与并发数相等) 2.记录脚本本身PID并启动计时器进程(计时终止后杀脚本本身PID) 3.并发执行 ...
- java如何优雅的实现时间控制
前言:最近小王同学又遇到了一个需求:线上的业务运行了一段时间,后来随着使用人数增多,出现了一个问题是这样的,一个订单会重复创建几次,导致数据库里出现了很多垃圾数据.在测试同学的不断测试下,发现问题出在 ...
- 最终解决 mouseenter, mouseleave , mouseout mousehover mousemove等事件的区别?
在jquery中, html页面的div的显示和隐藏, 修改等的功能, 最终都要由 事件 触发来引用, 不管是键盘事件, 还是鼠标事件... mouseenter和mouseleave是成对对应的, ...
- mouseover,mouseenter,mouseleave,mouseout
mouseover和mouseout对应 //鼠标移入移出触发该元素及子元素 mouseenter和mouseleave对应 //鼠标移入移出只触发该元素 看完例子即可知道其区别: mouseover ...
- WdatePicker()时间控制方式(转载+原创)
控制时间在制定范围内: <input class="wzsrk" name="startDateStr" id="startDateStr ...
- linux下socket connect 阻塞方式 阻塞时间控制
同事今天问我,如何在linux下的c代码里面控制connect的阻塞时间.应用的背景是:linux下的c程序有两个目标IP需要connect,如果用阻塞方式,当其中一个IP不能连接的情况下,程序将阻塞 ...
随机推荐
- strip_tags,htmlspecialchars,htmlentities,stripslashes,addslashes学习小结
一.strip_tags 从字符串中去除 HTML 和 PHP 标记 string strip_tags ( string $str [, string $allowable_tags ] ) str ...
- 如何在安装32位Oracle客户端组件的情况下以64位模式运行
C#使用System.Data.OracleClient连接Oracle数据库.之前在WinXP上正常运行的程序移植到Windows 2008 x64上之后就连不上数据库了,错误信息如下:启动data ...
- SQL数据库约束行为---防止数据完全重复
防止同一条数据完全重复: 一.主关键字约束:主键约束.1.能够唯一的区分每一行数据.——不许重2.表中的数据按照主键字排序的.——有序3.主键字不能为空——不为空4.一个表只能有一个主键,但可以设置组 ...
- C++ const 的全面总结[转]
C++中的const关键字的用法非常灵活,而使用const将大大改善程序的健壮性,本人根据各方面查到的资料进行总结如下,期望对朋友们有所帮助. Const 是C++中常用的类型修饰符,常类型是指使用类 ...
- Cheatsheet: 2015 04.01 ~ 04.30
Other CentOS 7.1 Released: Installation Guide with Screenshots A Git Style Guide Recommender System ...
- java传递和返回对象
java传递的只是一个引用,一定要注意准确认识在对象传递和赋值时所发生的一切. 事实上,java中的每个对象(除了基本数据类型以外)的标识符都属于指针的一种,但是其使用受到了严格的限制和防范,不仅在编 ...
- iOS - Swift NSUserDefaults 数据存储
前言 public class NSUserDefaults : NSObject 用来保存应用程序设置和属性.用户保存的数据.用户再次打开程序或开机后这些数据仍然存在.如果往 userDefault ...
- iOS JS交互
1. 添加本地js文件, 并配置head中的属性 function increaseMaxZoomFactor() { var element = document.createElem ...
- JS 字符串编码函数(解决URL特殊字符传递问题):escape()、encodeURI()、encodeURIComponent()区别详解
javaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...
- poj2208Pyramids(四面体面积--公式)
链接 一公式题.. 证明讲解参照http://www.cnblogs.com/dgsrz/articles/2590309.html 注意对棱 顺序 #include <iostream> ...