Jquery 相同class div 怎么判断鼠标经过哪个并显示里面的隐藏层
思路:使用hover()函数监测鼠标经过事件,在hover()的处理函数内$(this)即表示当前处理的对象,也就是当前鼠标经过的class。然后使用toggle()函数实现内层元素在显示和隐藏之间切换。核心代码示例: $("div.outer").hover(function() { $(this).find(".inner").toggle(); // }, function() { $(this).find(".inner").toggle(); }); 下面进行一个实例演示: 1、HTML结构 我是隐藏1 我是隐藏2 2、jquery代码 $(function(){ $("div.inner").hide(); // 默认隐藏所有内层元素 $("div.outer").hover(function() { // 鼠标经过事件 $(this).find(".inner").toggle(); // 切换显示和隐藏 }, function() { $(this).find(".inner").toggle(); // 切换显示和隐藏 }); }); 3、效果演示
jq怎样实现鼠标经过隐藏,离开显示div层
Document *{margin: 0px;padding: 0px;list-style: none;text-decoration: none}/*通配符,个人习惯*/ .box{width: 100px;height: 100px;} .box_div{width: 100px;height: 100px;background: #FFFF00} $(function(){ $(".box").mouseover(function(){ $(".box_div").hide(); //隐藏 }) $(".box").mouseout(function(){ $(".box_div").show(); //显示 }) }) //mouseover 当鼠标指针位于元素上方时,会发生 mouseover 事件。 //mouseout 当鼠标指针离开被选元素时,会发生 mouseout 事件。 //hide(); hide() 隐藏 //show(); show() 显示 我是div
关于JQUERY中的hide()和show()
关于JQUERY中的hide()和show()说明如下: 1、jquery中show()是显示出隐藏的元素。 比如有如下代码: $(".btn2").click(function(){ $("p").show();}); 点击按钮2的时候,文字就显示出来了。 2、jquery中hide()是隐藏当前显示的元素。 $(".btn1").click(function(){ $("p").hide(); }); 点击按钮1的时候,文字就隐藏了。