吉本集の個人ブログ
Web制作の技術について書いています。たまに日記も書きます。

Tsudoi Plugin : 要素がブルブル震える – jquery.trembles

2014年3月28日 / category : jquery, plug-in-jquery

簡単なjQueryのプラグインを作ってみました。ホント簡単なものなので、紹介するほどでもないのですが、、、
マウスオーバーすると、オブジェクトがブルブルと震える、というプラグインです、ただそれだけです。

どんなものか、早速DEMOを。

DEMO

使い方も、簡単です。classを設定するだけです。

HTML
<head>
<script src="js/libs/jquery-1.11.0.min.js"></script> //jQueryを読み込む
<script src="js/jquery.trembles.min.js"></script>
</head>

<body>
<p class="tremble">テキスト</p>
<p><a href="#"><img src="images/img.jpg" height="200" width="200" alt="" class="tremble"></a></p>
</body>

プラグインの中で、CSSを設定しているため、要素によっては使えない場合もあります。

class=”tremble”を設定している要素に、CSSでpositoin指定をし、top,left,bottom,rightの指定をしている場合、プラグインのCSSが上書きされてしまい、レイアウトがおかしくなります。その場合は、要素の中に新たに要素を追加していただき、追加した要素にclass=”tremble”を設定すれば、回避できるかと思います。

対応ブラウザは、IE8以降まで検証済みですが、実務対応した場合に何か不具合が起こるかもしれません、その時は、ご連絡いただけると嬉しいです。

DownLoad : trembles.zip