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