高知から帰ったら席がのっとられていたagoです。
このたび弊社ではYUREX™ - ビンボーゆすりを科学したコラボ・プロダクトを開発として、YUREX製品サイトをOPENしました。
今回はこのサイトで使用している、文字や画像のリンク部分を揺らすjavascriptをjQuery.brbrとして(無駄に)jQuery Plugin化したので公開したいと思います。
使い方はjQueryと一緒に読み込み、揺らしたいelementsに対して.brbr()を指定するだけ。
$(function () { $(/* or selector */).brbr(); });
これで該当要素以下のリンクをカーソルで指定した場合にゆれるようになります。
指定できるパラメータと初期値は以下の通りです。
$(/* or selector */).brbr({
/*
ゆれる方向を指定。
top,left,''を指定可能。
''はtop,left交互にゆれる。
初期値 ''
*/
'move' : '',
/*
ゆれ幅をpxで指定。
初期値 3
*/
'swing' : 3,
/*
テキストの一回にゆれる回数を指定(画像はこの倍ゆれる)
初期値 3
*/
'count' : 3,
/*
ゆれ幅、ゆれる回数を配列で指定。
undefinedが指定された場合、swing幅でcount回ゆれる。
初期値 undefined
*/
'swingWidth' : undefined /* [3, -3, 3, -3, 3, -3] */
});
Plugin自体はMIT、GPLのDual license、公開場所はCodeReposを使用させていただいているので、興味のある方はご自由に組み込み、修正を行ってください。
ちなみに、このブログでは標準でjQueryが組み込まれているため、以下のリンクをクリックすることで一時的にリンクを揺らす機能をお試しいただくことが可能です。
カヤックでは一見くだらないことに力を入れられる方や、実用性はなくても面白ければ無駄に凝ってしまう技術者を募集しています!