mouseover()、 mouseout() 和 mouseenter()、 mouseleave()以及hover()的相同和不同点

概述<! DOCTYPE html > < html lang =" en " > < head > < meta charset =" UTF-8 " > < meta name =" viewport " content =" width=device-width, initial-scale=1.0 " > < meta http-equiv =" X-UA-Compatible " conte
<! DOCTYPE HTML > < HTML lang =" en " > < head > < Meta charset =" UTF-8 " > < Meta name =" vIEwport " content =" wIDth=device-wIDth,initial-scale=1.0 " > < Meta http-equiv =" X-UA-Compatible " content =" IE=edge " > < Title >document </ Title > < script src =" Js/jquery.min.Js " > < / script > < STYLE > . div3 { background : red ; wIDth : 100 px ; height : 100 px ; position : relative ; overflow : hIDden } . div4 { background : green ; wIDth : 50 px ; height : 50 px ; position : absolute ; top : -40 px } < / STYLE > </ head > < body > < div class =" div3 " >< div class =" div4 " ></ div ></ div > < script > // $(".div3").mouSEOver(function(){ // $(".div4").stop().animate({ // top:0 // },500)//子元素会受到冒泡机制影响，放到子元素上的时候会触发事件，stop()并不能完全阻止 // }).mouSEOut(function(){ // $(".div4").stop().animate({ // top:‘-40px‘ // },500) // }) $( function (){ $( " .div3 ") . mouseenter( function (){ // 子元素不会触发父元素的事件 $( " .div4 ") . animate( { top : 0 }, 500) }) . mousel( function (){ $( " .div4 ") . animate( { top : ‘ -40px ‘ }, 500) }) }) // hover()和mouSEOver mouSEOut 相同 < / script > </ body > </ HTML > 总结

以上是内存溢出为你收集整理的mouseover()、 mouseout() 和 mouseenter()、 mouseleave()以及hover()的相同和不同点全部内容，希望文章能够帮你解决mouseover()、 mouseout() 和 mouseenter()、 mouseleave()以及hover()的相同和不同点所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。