jQuery——動畫、類數(shù)組

2、動畫
   jquery中常用的動畫的方法就是hide()與show().
       $(element).hide()這段代碼可以與這相等element.css("display","none")
       在hide(time)與show(time)中填入事件,可以慢慢消失跟顯現(xiàn)。可以修改元素的多個樣式,高度,寬度,不透明度。
   另一組方法fadeIn()與fadeOut()這個與hide跟show不同的是,當使用hide或者show的時候會改變網(wǎng)頁的高度,而fadeIn與fadeOut則不會。
       還有一組是slideUp,slideDown改變高度。
   方法說明:
       Hide()/show():同時修改多個樣式屬性:高度、寬度、不透明度。
       fadeIn()/fadeout():只修改不透明度。
       slideUp()/slideDown():只改變高度。
       fadeTo():只改變不透明度。
       Toggle():用來替代hide()方法和show()方法,所以會同時修改多個樣式屬性即高度寬度和不透明度。
       slideToggle():用來代替slideUp()和slideDown()方法,所以只能改變高度。
       Animate():屬于自定義動畫的方法,直接使用animate()方法還能自定義其他的屬性樣式,例如left,marginLeft,scrollTop等。

   1)、show(), hide()       animate / a1.html
       a,作用: 通過同時改變元素的寬度和高度來實現(xiàn)顯示或者隱藏。
       b,用法:
           show(速度,[callback])
           速度: 'slow','normal','fast',也可以用毫秒數(shù)
           callback: 當整個動畫執(zhí)行完畢之后,會立即調(diào)用這個函數(shù)(回調(diào)函數(shù))。
   2)、slideUp() slideDown()  animate / a1.html
       a,作用:通過改變元素的高度來實現(xiàn)顯示或者隱藏
       b,用法:同show
   3)、fadeIn() fadeOut()  animate / a2.html
       a,作用:通過改變不透明度來實現(xiàn)顯示或者隱藏
       b,用法:同show
   4)、自定義動畫 animate animate / a3.html
       用法:
       animate(params,speed,[callback])
           params: 是一個javascript對象,描述了動畫完成之后元素的樣式。比如: {'left':'500px','top':'200px'}
           speed:速度,單位是毫秒
           callback:回調(diào)函數(shù),也就是說,當整個動畫執(zhí)行完畢之后會執(zhí)行。
   5)、動畫隊列問題
       a、一組元素上的動畫效果。
           a)當在一個animate()方法中應用多個屬性時,動畫是同時發(fā)生的。
           b)當以鏈式的寫法應用動畫方法時,動畫是按照順序發(fā)生的。
       b、多組元素上的動畫效果。
           a)默認情況下,動畫都是同時發(fā)生的。
           b)當以回調(diào)的形式應用動畫方式時,動畫是按照回調(diào)順序發(fā)生的。
       另外,在動畫方法中,要注意其他非動畫的方法會插隊,例如css()方法,要使這些非動畫的方法也按照順序來執(zhí)行,需要把這些方法寫在動畫方法的回調(diào)函數(shù)中。
       例子:
       $('#id').animate({left:'600px',top:'400px'},3000,function(){
           $(this).css('border','2px solid blue');
       });
       若想要動畫停止,需要在animate()方法前插入stop()方法
           如:$("#id").stop().animate()注意stop中的兩個參數(shù)。
       判斷元素是否在動畫狀態(tài)的方法時:
           $(element).is(":animated");
3、類數(shù)組的操作  array/a1.html
   所謂類數(shù)組,指的是jQuery對象里面包含的所有的dom對象??梢岳胘Query對象提供的一些方法和屬性來對這些dom對象進行遍歷。
   1)屬性
       length: 獲得dom對象的個數(shù)。
   2)方法
       a, each(fn(i)):循環(huán)遍歷每一個元素,
           i表示被迭代的對象的下標
           this代表被迭代的dom對象,
           $(this)代表被迭代的jquery對象。
       b,eq(index):返回index位置處的jquery對象
       c,index(obj):返回下標,其中obj可以是dom對象或者jquery對象。
       d,get():返回dom對象組成的數(shù)組
       e,get(index):返回index位置處的dom對象。

成都創(chuàng)新互聯(lián)服務項目包括樂安網(wǎng)站建設、樂安網(wǎng)站制作、樂安網(wǎng)頁制作以及樂安網(wǎng)絡營銷策劃等。多年來,我們專注于互聯(lián)網(wǎng)行業(yè),利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關(guān)系等,向廣大中小型企業(yè)、政府機構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案,樂安網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟效益。目前,我們服務的客戶以成都為中心已經(jīng)輻射到樂安省份的部分城市,未來相信會繼續(xù)擴大服務區(qū)域并繼續(xù)獲得客戶的支持與信任!

網(wǎng)頁題目:jQuery——動畫、類數(shù)組
路徑分享:http://bm7419.com/article48/gijjep.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站設計、網(wǎng)站設計公司、、域名注冊微信小程序、網(wǎng)站營銷

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

商城網(wǎng)站建設