Jquery——hover与toggle
生活随笔
收集整理的這篇文章主要介紹了
Jquery——hover与toggle
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
hover方法的語(yǔ)法結(jié)構(gòu)為:hover(enter,leave)hover()當(dāng)鼠標(biāo)移動(dòng)到元素上時(shí),會(huì)觸發(fā)第一個(gè)方法,當(dāng)鼠標(biāo)移開的時(shí)候會(huì)觸發(fā)第二個(gè)方法復(fù)制代碼
<html><head><title>測(cè)試用</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>測(cè)試用</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è)前端知識(shí),請(qǐng)上 【猿2048】www.mk2048.com
?
更多專業(yè)前端知識(shí),請(qǐng)上 【猿2048】www.mk2048.com
總結(jié)
以上是生活随笔為你收集整理的Jquery——hover与toggle的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: JQuery让input从disable
- 下一篇: setTimeout和setInterv