浅谈jQuery hover(over, out)事件函数_jquery

hover(over, out)事件函数

当鼠标移动一个匹配的元素上面,会触发指定的第一个函数

当鼠标移出这个元素时,会触发指定的第二个函数

over(function):鼠标移到元素上触发的函数

out(function):鼠标移出元素触发的函数

<nav class="main-nav">
  <a href="/"><span>首页</span></a>
  <a href="/about"><span>关于考试</span></a>
  <a href="/exam"><span>报考指南</span></a>
  <a href="/news"><span>考试情报</span></a>
  <a href="/career"><span>考试与就业</span></a>
  <a class="omega" href="/sitemap"><span>网站地图</span></a>
</nav>
<script>
$(function(){ 
//鼠标移到与移出,移到元素时,添加当前元素样式,并且去掉当前页面的样式。鼠标移出时,去掉当前元素的样式,并且添加当前页面的样式
  $('.main-nav').find('a').hover(
    function(){$(this).addClass('cur');$('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').removeClass('cur');},
    function(){$(this).removeClass('cur');$('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').addClass('cur');}
  );
  $('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').addClass('cur'); //加载页面时就添加样式
});
</script> 

获取<a href="/"></a>这个元素

$(".main-nav").find('a[href="/"]');

以上这篇浅谈jQuery hover(over, out)事件函数就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索over
, out
hover
jquery hover out、jquery hoverout、hover over、hover over a rock、hover over sb,以便于您获取更多的相关知识。

时间: 2024-08-31 21:26:25

浅谈jQuery hover(over, out)事件函数_jquery的相关文章

浅谈jquery之on()绑定事件和off()解除绑定事件_jquery

off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该函数.其主要有以下两种形式的用法: 用法一: jQueryObject.off( [ events [, selector ] [, handler ] ] ) 用法二: jQueryObject.off( eventsMap [, selector ] ) 参数 参数 描述 events 可选/S

浅谈jquery高级方法描述与应用_jquery

1.addBack() a. third-item的 li 下几个相邻节点(包括third-item) $( "li.third-item" ).nextAll().addBack(). .css( "background-color", "red" ); b. 和end()方法类似,选中的是div.after-addback和p元素,end选中的是div.after-addback元素 $( "div.after-addback&qu

浅谈jquery上下滑动的注意事项_jquery

div: <div id="pay_box" class="vip_bottom"> fffff </div> style: .vip_bottom{position: fixed; display: none;//注意,先不显示,点击某个div后从上向下滑动,默认时none,这样才会有滑动效果 bottom:0px;//按照正常显示的时候写 width: 100%; box-sizing: border-box; height:80px;

浅谈JQuery+ajax+jsonp 跨域访问_jquery

Jsonp(JSON with Padding)是资料格式 json 的一种"使用模式",可以让网页从别的网域获取资料. 一. 客户端 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv=&q

浅谈jquery的map()和each()方法_jquery

1. map()方法 //找到所有的标题元素,映射它们的ID,并转化为数组后排序 $(':header').map(function(){return this.id}).toArray().sort(); 2. each()方法 $('div').each(function(){ if($(this).is(':hidden')) return;//跳过隐藏的元素 //对可见的元素操作 }); 以上这篇浅谈jquery的map()和each()方法就是小编分享给大家的全部内容了,希望能给大家一

浅谈Jquery为元素绑定事件_jquery

Jquery如何为元素绑定事件,小记一下,防止忘记了! $(this).bind({ click:function(){ window.open(alert('OK')); }, mouseover:function(){ window.open(alert('OK')); }, mouseout:function(){ window.open(alert('OK')); } }); 以上所述就是本文的全部内容了,希望大家能够喜欢. 以上是小编为您精心准备的的内容,在的博客.问答.公众号.人物.

浅谈Jquery为元素绑定事件

  jQuery 使用on绑定动态生成的元素时,不能直接用该对象操作,而是选择其非动态生成的父节点然后再找到本身才能达到效果.大家看看源码就知道了. Jquery如何为元素绑定事件,小记一下,防止忘记了! ? 1 2 3 4 5 6 7 8 9 10 11 $(this).bind({ click:function(){ window.open(alert('OK')); }, mouseover:function(){ window.open(alert('OK')); }, mouseout

浅谈jQuery.easyui的datebox格式化时间_jquery

方法很简单,这里就不多废话了,直接奉上代码: $.fn.datebox.defaults.formatter = function (date) { var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); return y + '/' + (m < 10 ? ('0' + m) : m) + '/' + (d < 10 ? ('0' + d) : d); } 以上所述就是本文的全部内容了,

浅谈Jquery核心函数_jquery

      在Jquery中,所有的DOM对象都将封装成Jquery对象,而且只有Jquery对象才能使用Jquery方法或者属性来执行相应的操作. 所以Jquery提供了一个可以将DOM对象封装成Jquery对象的函数,就是Jquery核心函数jquery(),也称为工厂函数. jquery核心函数有7个重载,分别如下: jquery()  该函数返回一个空的jquery对象. jquery(elements)  该函数将一个或多个DOM元素转化为Jquery对象(或jquery集合) jqu