Jquery——hover与toggle
生活随笔
收集整理的這篇文章主要介紹了
Jquery——hover与toggle
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
hover方法的語法結(jié)構(gòu)為：hover（enter，leave）hover()當(dāng)鼠標(biāo)移動到元素上時(shí)，會觸發(fā)第一個(gè)方法，當(dāng)鼠標(biāo)移開的時(shí)候會觸發(fā)第二個(gè)方法復(fù)制代碼
<html><head><title>測試用</title><script type="text/javascript" src="../jquery-1.3.2.min.js"></script><script type="text/javascript">window.onload=init;function init(){$("#panel h5.head").hover(function(){$(this).next().hide();},function(){$(this).next("div .content").show();});}</script></head><body><div id="panel"><h5 class="head">什么事jquery</h5><div class="content">混蛋</div></div></body>
</html>復(fù)制代碼toggle(fn1,fn2,fn3..）這個(gè)方法是每次單擊調(diào)用下一個(gè)方法，如果方法是最后一個(gè)，那么從第一個(gè)開始如果只有2個(gè)方法，則是互相切換效果。復(fù)制代碼
<html><head><title>測試用</title><script type="text/javascript" src="../jquery-1.3.2.min.js"></script><script type="text/javascript">window.onload=init;function init(){$("#panel h5.head").toggle(function(){$(this).addClass("highlight");$(this).next().hide();},function(){$(this).removeClass("highlight");$(this).next("div .content").show();});}</script><style type="text/css">.highlight{background:#ff3300;}</style></head><body><div id="panel"><h5 class="head">什么事jquery</h5><div class="content">混蛋</div></div></body>
</html>
更多專業(yè)前端知識，請上 【猿2048】www.mk2048.com
?
更多專業(yè)前端知識，請上 【猿2048】www.mk2048.com
總結(jié)
以上是生活随笔為你收集整理的Jquery——hover与toggle的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JQuery让input从disable
- 下一篇： setTimeout和setInterv