JavaScript

指定した要素をパカパカと点滅させることができる「jquery.flicker」

とてもシンプルなプラグインだったのでメモがてらご紹介します。指定した要素をパカパカと点滅させることができる「jquery.flicker」です。何か間違った操作をした時に警告っぽい感じを出したい場合にいいかもしれないですね。普通のファイルで946 Bytes、minの方で771 Bytesということでめっちゃ軽量です。という訳で以下使い方です。

[ads_center]

使い方

jQuery本体とダウンロードしたjquery.flicker.js(またはjquery.flicker.min.js)を読み込みます。

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1'></script>
<script type="text/javascript" src="jquery.flicker.js"></script>
<script type="text/javascript">
$(function(){
    $('#sample').click(function(){
        $('body').flicker({
            'reps': 5, 
            'pause': 200, 
            'delay': 800, 
            'color': '#e55'
        });
    });
});
</script>

上記はid名がsampleという要素をクリックするとbodyが点滅するようになります。

オプション

オプションは点滅の回数や色、間隔などを設定できます。

reps

点滅する回数です。

pause

点滅して色がついている時の時間の長さです。

delay

点滅する間隔です。

color

色を設定できます。

こんな感じで使い方やオプションもシンプルで使いやすいですね。ちょっとした注意を促す時なんかに使ってみたいプラグインかと思います。

以下からダウンロードできます。

関連記事

  1. JavaScript

    スライドアニメーションが素敵なjQueryスライダー「Slideshow with jmpress.…

    とても素敵なスライドアニメーションを実装することができるjQueryス…

  2. Protip

    JavaScript

    カスタマイズ性抜群のツールチップを実装できる「Protip」

    Protipはカスタマイズ性が抜群のツールチップを実装することができる…

  3. xGallerify

    JavaScript

    サイズが異なる画像でもキレイに表示できるギャラリー実装「xGallerify」

    xGallerifyはギャラリーを作成するのに最適なjQueryプラグ…

  4. Prism Effect Slider

    JavaScript

    プリズム効果を実装することができるスライダー「Prism Effect Slider」

    おもしろいスライダーがあったのでご紹介します。Prism Effect…

  5. jExcel

    JavaScript

    Excelと互換性のあるスプレッドシートを埋め込めるjQueryプラグイン「jExcel」

    jExcelは、ブラウザにExcelと互換性のあるスプレッドシートを埋…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. KMC-80BK
  2. 味噌ラーメン〜旨辛にんにく味噌〜
  3. STP-XH70
  4. 久保田城

Instagram始めました

Facebookページ

PAGE TOP