jQuery Easing Plugin は、jQuery のエフェクト動作パターン集のようなプラグイン。jQuery にも、linear と swing のシンプルな動作パターン（ easing ）は用意されているが、jQuery Easing Plugin を導入すると、30種類以上もの、変化に富んだ動作パターンを使えるようになる。
エフェクト動作パターンは、animate などで使うことが多い。（参照：animate の動作パターンの指定方法）
導入
jQuery Easing Pluginより、jquery.easing.1.3.js を、ダウンロード。「 jquery.easing.1.3.js 」ファイルを、自分のサイトのサーバーにアップロード。
使用したいページで、下記のようにして読み込む。「 jquery.easing.1.3.js 」ファイルへのパスは、アップロードした場所を指定する。
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
jQuery Easing Plugin 使用例
jQuery Easing Plugin の動作パターンを、animate に使用した例。
赤いブロック部分を、クリックすると、グレーのブロック部分が、左に動きながら消える。もう一度、赤いブロック部分を、クリックすると、グレーのブロック部分が、右に動きながら出現。動き方( easing )は、それぞれのタイトルごとに異なる。タイトルが、動作パターン名であり、これを easing: 動作パターン; に指定してある。
jswing
animate( { width: 'toggle',}, { duration: 2000, easing: 'jswing', } )
easeInQuad
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInQuad', } )
easeOutQuad
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutQuad', } )
easeInOutQuad
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutQuad', } )
easeInCubic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInCubic', } )
easeOutCubic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutCubic', } )
easeInOutCubic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutCubic', } )
easeInQuart
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInQuart', } )
easeOutQuart
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutQuart', } )
easeInOutQuart
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutQuart', } )
easeInQuint
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInQuint', } )
easeOutQuint
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutQuint', } )
easeInOutQuint
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutQuint', } )
easeInSine
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInSine', } )
easeOutSine
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutSine', } )
easeInOutSine
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutSine', } )
easeInExpo
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInExpo', } )
easeOutExpo
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutExpo', } )
easeInOutExpo
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutExpo', } )
easeInCirc
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInCirc', } )
easeOutCirc
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutCirc', } )
easeInOutCirc
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutCirc', } )
easeInElastic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInElastic', } )
easeOutElastic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutElastic', } )
easeInOutElastic
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutElastic', } )
easeInBack
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInBack', } )
easeOutBack
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutBack', } )
easeInOutBack
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutBack', } )
easeInBounce
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInBounce', } )
easeOutBounce
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeOutBounce', } )
easeInOutBounce
animate( { width: 'toggle',}, { duration: 2000, easing: 'easeInOutBounce', } )