この記事では、jQuery を使用してウェブサイト ナビゲーションのジッター効果を実現する方法を紹介します。主に各トラバーサル ノードを使用し、カスタム アニメーションをアニメーション化します。jQuery を学習している友人に役立つことを願っています。
#jQuery を使用して Web サイト ナビゲーションのジッター効果を実現する
知識ポイント
1それぞれがノードを通過します 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' }) } });