Jquery 鼠标等待1秒后 翻页特效（下到上）

今天项目碰到了这个特效需求~~ 搞了一个下午 终于与现在这个时候写出来了  

特此留念----  

 

var myTimer;
	var runStatu = 0;
	$(".wall-layout-div").hover(		
		function(){			
			runStatu = 1;
			$(this).find("div:first").css("background-color","#ECECEC"); //
			var obj = $(this).find("div:first");
			myTimer = setTimeout(function(){runStatu = 2;$(obj).animate({"marginTop": "-=200px"}, "fast");},1000);	
		},
		function(){		
			$(this).find("div:first").css("background-color","#FFF");
			if(runStatu == 1){
				clearTimeout(myTimer);
			}else if(runStatu == 2){
				$(this).find("div:first").animate({"marginTop": "+=200px"}, "fast");
				runStatu = 0;
			}
		}
	);

 

第一步：当然上创建一个 setTimeout对象了。。这个应该是没有任何问题的了。。 

第二部：Jquery 悬停效果-- 这个也不用多说

第三部：最重要的一步 ，， 我就是卡在这里半天！！

var obj = $(this).find("div:first")

 

这里创建了一个对象obj 用来存放 我要翻往上头的div~  

如果你这里这么写  我就截取之前我写的一段

 

 

 

myTimer = setTimeout(function(){runStatu = 2;

$(this).find("div:first").animate({"marginTop": "-=200px"}, "fast");},1000);	

 

 

 

 

那么恭喜你。。。 $(this) 对象是读取不到的，我试过alert(this) 理论上会返回Object 但是真实返回值是无 ， 也就是根本没有打印出来

....................................................................

 

第四部：当然是用来判断状态了   稍微解释一下 状态0 ： 初始化    1：悬停在上方   2：翻页效果实现之后状态

这个就是全部过程了 第三部是最重要的！！ 

 

希望对碰到这个问题的朋友门能少走弯路~~   

 

本文固定链接：http://www.verydemo.com/demo_c110_i34660.html