ボタンをクリックした時にアニメーションするjQueryプラグイン「animateClick」!

2016/04/03

こんにちは。
今回はボタンをクリックした時にアニメーションするjQueryプラグイン「animateClick」!です。

ボタンをクリックした際にチェックやバツ印などを表示するアニメーションを実装できるjQueryプラグインを紹介します。

ボタンをクリックした時にアニメーションするjQueryプラグイン「animateClick」!

animateClick

animateclick

 

jQueryプラグイン「animateClick」をダウンロードしてみよう!

http://ajarunthomas.com/jquery/animateClick/にアクセスしてグロナビの「Download」のボタンをクリックしてダウンロードします。

 

jQueryプラグイン「animateClick」を設置してみよう!

jQuery本体とanimateClick.jsを/bodyの手前に読み込みます。

 

その下に下記のスクリプトを記述します。

 

オプションはこんな感じです。
アニメーションはDefault、signal、shoot、tick、crossの5種類が用意されています。

 

html部分を記述します。
先ほど指定した「btn」というidを付けます。

 

プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート
プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート

 

いかがでしたか。これからの案件で使ってみたいですね。
以上でボタンをクリックした時にアニメーションするjQueryプラグイン「animateClick」!でした。

topへ戻る