Jquery——hover与toggle
生活随笔
收集整理的這篇文章主要介紹了
Jquery——hover与toggle
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
hover方法的語法結構為：hover（enter，leave）hover()當鼠標移動到元素上時，會觸發第一個方法，當鼠標移開的時候會觸發第二個方法復制代碼
<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>復制代碼toggle(fn1,fn2,fn3..）這個方法是每次單擊調用下一個方法，如果方法是最后一個，那么從第一個開始如果只有2個方法，則是互相切換效果。復制代碼
<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>
更多專業前端知識，請上 【猿2048】www.mk2048.com
?
更多專業前端知識，請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的Jquery——hover与toggle的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JQuery让input从disable
- 下一篇： setTimeout和setInterv