jquery實現(xiàn)盒子下拉效果示例代碼
更新時間：2013年09月12日 17:27:28 作者：
當(dāng)把鼠標(biāo)移動到盒子上的時候上面就會出現(xiàn)一個黑色的盒子,這是在瀏覽網(wǎng)頁的時候看到的一個效果，具體實現(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)文章
javascript中對Attr(dom中屬性)的操作示例講解
這篇文章主要是對javascript中對Attr(dom中屬性)的操作進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
最近一段時間準(zhǔn)備開始學(xué)習(xí)JQUERY,感覺JQUERY的功能非常強(qiáng)大,而且代碼量也減少了許多....代碼也非常的清晰!2011-03-03
在開發(fā)項目過程中，用iframe嵌套，會發(fā)現(xiàn)一個問題，用iframe嵌套的html結(jié)構(gòu)右邊不會自動適應(yīng)高度。如何解決這一問題呢，下面就跟小編一起來看下吧2016-12-12
jQuery制作簡潔的多級聯(lián)動Select下拉框
省市多級聯(lián)動的select下拉框有很多種實現(xiàn)方式，度娘上隨便一搜就一大堆，今天我們來討論的這款特效，代碼卻很簡潔，兼容性也非常棒，推薦給大家。2014-12-12
這篇文章主要介紹了jQuery橫向擦除焦點圖特效，一個具有自己特色的焦點圖會吸引用戶的注意力，讓用戶產(chǎn)生瀏覽網(wǎng)站的興趣至關(guān)重要，現(xiàn)在小編推薦給大家一款特別棒的焦點圖，感興趣的小伙伴可以參考下。2015-09-09
jquery isType() 類型判斷代碼，需要的朋友可以參考下。2011-02-02
Jquery倒數(shù)計時按鈕setTimeout的實例代碼
這篇文章介紹了Jquery倒數(shù)計時按鈕setTimeout的實例，有需要的朋友可以參考一下2013-07-07
無論是window.setTimeout還是window.setInterval，在使用函數(shù)名作為調(diào)用句柄時都不能帶參數(shù)，解決辦法是在此函數(shù)的基礎(chǔ)上在做一層封裝2013-05-05
這篇文章主要介紹了jQuery包裹節(jié)點用法,結(jié)合完整實例形式分析了jQuery中wrap方法包裹節(jié)點的使用技巧,注釋中還包含了wrapAll與wrapInner方法的使用,需要的朋友可以參考下2016-09-09
xheditor和validate都是優(yōu)秀的jQuery插件，但將兩者組合到起，如果初始化的順序不當(dāng)，則會出現(xiàn)一些微妙的結(jié)果。2010-04-04