這篇文章介紹了使用jQuery實現網站導航抖動效果的方法,主要用到了each遍歷節點和animate自訂動畫,希望對學習jQuery的朋友有幫助!
使用jQuery實作網站導航抖動效果
知識點
1、 each遍歷節點
2、animate()自訂動畫
程式碼
運行結果
滑鼠放上後會不停抖動
// 停止抖动 stopShake(this); }); function shake(ele) { // 1. 设置css $(ele).css({ 'position': 'relative' }); // 2. 确定走动的值 var animateLeft = $(ele).css('left') === '10px' ? '-10px' : '10px'; $(ele).animate({ left: animateLeft }, 100, function () { shake(ele); }); } function stopShake(ele) { $(ele).stop(true, false).css({ left: '0' }) } });