快捷導(dǎo)航

jQuery刪除一個(gè)元素后淡出效果展示刪除過程的方法

更新時(shí)間：2015年03月18日 10:20:45 作者：上大王

這篇文章主要介紹了jQuery刪除一個(gè)元素后淡出效果展示刪除過程的方法,實(shí)例分析了jQuery中fadeTo及slideUp等方法的使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了jQuery刪除一個(gè)元素后淡出效果展示刪除過程的方法。分享給大家供大家參考。具體分析如下：

當(dāng)我們刪除一個(gè)元素時(shí)希望能看到刪除的過程，這個(gè)效果通過對元素進(jìn)行淡出展示動(dòng)態(tài)化刪除過程。

$("#myButton").click(function() {
  $("#myDiv").fadeTo("slow", 0.01, function(){//fade
    $(this).slideUp("slow", function() {//slide up
      $(this).remove();//then remove from the DOM
    });
  });
});

希望本文所述對大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

前端開發(fā)部分總結(jié)[兼容性、DOM操作、跨域等]（持續(xù)更新）
在公司做這個(gè)項(xiàng)目已經(jīng)6個(gè)多月了，總結(jié)一些問題，也算是拋磚引玉吧，希望更多的朋友一起分享一些技巧。
2010-03-03
jQuery :nth-child前有無空格的區(qū)別分析
:nth-child(index)子元素過濾選擇器的描述是：選取每個(gè)父元素下的弟index個(gè)子元素，index從1開始。
2011-07-07
jquery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊后展開列表內(nèi)容的導(dǎo)航欄效果
這篇文章主要介紹了jquery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊后展開列表內(nèi)容的導(dǎo)航欄效果,通過簡單的jQuery鏈?zhǔn)讲僮鲗?shí)現(xiàn)針對頁面元素的遍歷及樣式動(dòng)態(tài)變換功能,需要的朋友可以參考下
2015-09-09
jQuery點(diǎn)擊自身以外地方關(guān)閉彈出層的簡單實(shí)例
本篇文章主要是對jQuery點(diǎn)擊自身以外地方關(guān)閉彈出層的簡單實(shí)例進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
jQuery EasyUI NumberBox(數(shù)字框)的用法
jQuery EasyUI 數(shù)字框(NumberBox)用法
2010-07-07
JQuery入門——事件切換之hover()方法應(yīng)用介紹
謂切換事件，即有兩個(gè)以上的事件綁定于一個(gè)元素，在元素的行為動(dòng)作間進(jìn)行切換,有兩個(gè)方法用于事件的切換，一個(gè)方法是hover()，另一個(gè)是toggle(),感興趣的朋友不妨了解下,或許對你有所幫助
2013-02-02
jQuery1.6 正式版發(fā)布并提供下載
據(jù)jQuery官方博客5月3日的最新消息，jQuery 1.6 正式版已經(jīng)可以下載使用。jQuery 1.6 版本包括了對屬性(Attribute)模型的重要重寫，還有諸多性能優(yōu)化。借此機(jī)會(huì)感謝jQuery開發(fā)團(tuán)隊(duì)和jQuery錯(cuò)誤分類團(tuán)隊(duì)的成員。
2011-05-05
jquery 簡單的進(jìn)度條實(shí)現(xiàn)代碼
jquery其實(shí)是有個(gè)進(jìn)度條插件的，叫做jqueryprogressbar.js，可是想練習(xí)一下，就沒有用，自己寫了點(diǎn)代碼。這個(gè)代碼其實(shí)是參考別人的，因?yàn)樽约旱腏S基礎(chǔ)不是很好。
2010-03-03
jQuery中each和js中forEach的區(qū)別分析
這篇文章主要介紹了jQuery中each和js中forEach的區(qū)別,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery中each和js中forEach針對數(shù)組與對象遍歷的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下
2019-02-02
動(dòng)態(tài)標(biāo)簽懸停效果延遲加載示例代碼
懸停效果、延遲加載想必大家都有見到過吧，在本文將為大家介紹下是如何實(shí)現(xiàn)的，感興趣的朋友不要錯(cuò)過
2013-11-11