浅析jQuery里面的.hover事件

.Hover() 是一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态。

当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。而且,会伴随着对鼠标是否仍然处在特定元素中的检测(例如,处在div中的图像),如果是,则会继续保持“悬停”状态,而不触发移出事件(修正了使用mouseout事件的一个常见错误)。

有以下两种使用情况:

(1).hover(over,out)

over:鼠标移到元素上要触发的函数

out: 鼠标移出元素要触发的函数

e.g(给某一个‘td‘元素,添加鼠标悬停事件):

$(‘td‘).hover(function(){$(this).addClass("hover")},  function(){$(this).removerClass("hover")});

(2) .hover(out)

out: 当鼠标移到元素上或移出元素时触发执行的事件函数

$(‘td‘).bind(‘mouseenter mouseleave‘, handlerInout);

$(‘td‘).hover(handlerInout);

第二个例子是说 .hover 通过绑定handlerInout这个变量来切换方法。

时间: 2024-08-04 08:05:29

浅析jQuery里面的.hover事件的相关文章

jQuery – 鼠标经过(hover)事件的延时处理

(function($){ $.fn.hoverDelay = function(options){ var defaults = { hoverDuring: 200, outDuring: 200, hoverEvent: function(){ $.noop(); }, outEvent: function(){ $.noop(); } }; var sets = $.extend(defaults,options || {}); var hoverTimer, outTimer; ret

jquery里面的attr和css来设置轮播图竟然效果不一致

/*封装$*/ // window.$=HTMLElement.prototype.$=function(selector){ // var elems=(this==window?document:this) // .querySelectorAll(selector); // return elems.length==0?null:elems.length==1?elems[0]:elems; // } /*广告图片数组*/ var imgs=[ {"i":0,"img&

jQuery鼠标经过(hover)事件的延时处理

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Typ

将原生JS和jquery里面的DOM操作进行了一下整理

创建元素节点 1.原生: document.createElement("div") 2.jquery: $("<div></div>") 创建文本节点并加入元素节点中 1.原生: var text=document.createTextNode("文本内容"); var p=document.createElement("p"); p.appendChild(text); 2.jquery: var 

点击事件里面的change事件,多次触发change事件

最近做个项目,在点击按钮后弹出一个层,里面有单选按钮,选中单选按钮时就可以动态添加到对应的地方了 $(".xinz").click(function(event){ event.stopPropagation(); radioBoxChange += 1; //clickChange = "shspClick"; var radioBox=$("#radioBox"); var hsBox=$(this).siblings(".deli

辛星浅析iptables里面的dport和sport

首先说一下dport和sport的概念: dport--------目的端口 sport--------来源端口 需要注意的是它和我们的数据包的流动行为方式有关奥,也就是看INPUT还是OUTPUT. 比如iptables   -A  INPUT   -p  tcp   --dport  80  -j  ACCEPT  这里的是INPUT参数,因此这个代表我们的这条数据包的是进入操作,那么这里的dport地址是80,也就是要访问我本地的80端口.该条数据包可以如下描述: (1)这是一条从外部进入

[图形图像]---浅析android里面的ImageView的ScaleType属性

在我们写UI布局的时候,常使用ImageView控件,控件布局写好后,.9.png图片如何填充这个ImageView控件,此时就有ImageView的ScaleType属性决定. ScaleType是ImgeView的一个内部枚举类:ImageView$ScaleType,它决定了图片对View视图的填充结构.API解释如下:Options for scaling the bounds of an image to the bounds of this view.它一共有7种填充模式,下面一个一

jquery里面的DOM操作(查找,创建,添加,删除节点)

一:创建元素节点(添加)    创建元素节点并且把节点作为元素的子节点添加到DOM树上 1.append(): 在元素下添加元素    用法:$("id").append("定义的节点"); 例如:var li1 = $("<li>橘子</li>");    添加属性节点:$("<li class='test'>草莓</li>") 2.appendTo(): 将元素添加到元素里面

jquery中取消和绑定hover事件的正确方式

在网页设计中,我们经常使用jquery去响应鼠标的hover事件,和mouseover和mouseout事件有相同的效果,但是这其中其中如何使用bind去绑定hover方法呢?如何用unbind取消绑定的事件呢?一.如何绑定hover事件先看以下代码,假设我们给a标签绑定一个click和hover事件:$(document).ready(function(){ $('a').bind({ hover: function(e) { //Hover event handler alert("hove