jquery實(shí)現(xiàn)盒子下拉效果示例代碼
更新時間:2013年09月12日 17:27:28 作者:
當(dāng)把鼠標(biāo)移動到盒子上的時候上面就會出現(xiàn)一個黑色的盒子,這是在瀏覽網(wǎng)頁的時候看到的一個效果,具體實(shí)現(xiàn)如下,感興趣的朋友可以了解下
復(fù)制代碼 代碼如下:
<script src="js/Jquery1.7.js"></script>
<script type="text/javascript">
$(function () {
$('div:eq(1)').css({ 'margin-top': '-=100px' });
$('div:first').mouseover(function () {
$('div:eq(1)').animate({'margin-top':'+=100px'});
})
$('div:first').mouseout(function () {
$('div:eq(1)').animate({ 'margin-top': '-=100px' });
})
</script>
復(fù)制代碼 代碼如下:
<pre name="code" class="html"><div style="width:600px;height:300px;overflow:hidden;">
<div style="background-color:#000;height:100px;">
</div>
<div style="background-color:#eee;height:300px;">
</div>
</div></pre><br>
<pre></pre>
<pre name="code" class="html"></pre><pre name="code" class="html">當(dāng)把鼠標(biāo)移動到盒子上的時候上面就會出現(xiàn)一個黑色的盒子</pre><pre name="code" class="html">這是在瀏覽網(wǎng)頁的時候看到的一個效果</pre><pre name="code" class="html">在這里寫了一下</pre>
相關(guān)文章
jQuery 常見操作實(shí)現(xiàn)方式和常用函數(shù)方法總結(jié)
一個優(yōu)秀的 JavaScript 框架,一篇 jQuery 常用方法及函數(shù)的文章留存?zhèn)渫?/div> 2011-05-05
jQuery實(shí)現(xiàn)的上傳圖片本地預(yù)覽效果簡單示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的上傳圖片本地預(yù)覽效果,結(jié)合實(shí)例形式分析了jQuery上傳圖片本地預(yù)覽所涉及的相關(guān)頁面元素屬性動態(tài)操作實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-03-03
jQuery實(shí)現(xiàn)Tab菜單滾動切換的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)Tab菜單滾動切換的方法,實(shí)例分析了jQuery通過鼠標(biāo)事件動態(tài)操作頁面元素切換的動畫效果實(shí)現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09
利用jQuery來動態(tài)為屬性添加或者刪除屬性的簡單方法
下面小編就為大家?guī)硪黄胘Query來動態(tài)為屬性添加或者刪除屬性的簡單方法。小編覺的挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
騰訊與新浪的通過IP地址獲取當(dāng)前地理位置(省份)的接口
通過IP地址獲取當(dāng)前地理位置(省份)的接口,方便大家可以直接使用結(jié)合自己的系統(tǒng)。2010-07-07
jQuery利用DOM遍歷實(shí)現(xiàn)商城結(jié)算系統(tǒng)實(shí)戰(zhàn)
這篇文章主要介紹了jQuery利用DOM遍歷實(shí)現(xiàn)商城結(jié)算系統(tǒng)實(shí)戰(zhàn),文章圍繞主題展開詳細(xì)的內(nèi)容介紹,具一定的參考價值,感興趣的小伙伴可以參考一下2022-06-06
jquery根據(jù)name取得select選中的值實(shí)例(超簡單)
下面小編就為大家分享一篇jquery根據(jù)name取得select選中的值實(shí)例(超簡單),具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-01-01最新評論

