JQuery是一個非常流行的JavaScript庫,它的核心就是通過DOM元素進行HTML網(wǎng)頁操作。本文將介紹JQuery中的animate()方法,它可以讓我們可以輕松地實現(xiàn)動畫效果。
語法格式:
$(selector).animate({params}, speed, callback);
通過該方法,我們可以實現(xiàn)對HTML元素的所有CSS屬性進行動畫操作。其中,params是CSS屬性名和CSS屬性值的鍵值對,speed表示動畫播放速度,callback則是動畫執(zhí)行完畢后所執(zhí)行的回調(diào)函數(shù)。
// 給div元素添加animate方法 $("div").animate({ left:'250px', opacity:'0.5', height:'toggle', width:'+=150px' }, 5000, function() { console.log("Animation complete"); });
上述的代碼將會讓div元素向左移動250px,透明度變?yōu)?.5,高度進行切換,寬度增加150像素。動畫執(zhí)行時間為5000毫秒(即5秒),動畫執(zhí)行完畢后將會執(zhí)行回調(diào)函數(shù)并在控制臺上輸出“Animation complete”。
可以看出,animate()方法是一個非常實用的功能,它可以大幅度簡化我們對HTML元素的動畫操作。