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

色を設定できます。

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

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

色々なブランドカラーの値を知ることができる「BrandColors」前のページ

WordPressで自分がログイン中はGoogle アナリティクスを読み込ませない(非表示)ようにするやり方次のページWordPressのログイン時のツールバー

関連記事

  1. jQuery Social Share Bar
  2. Block Slide

    JavaScript

    jQueryプラグインで印象的なエフェクトで魅せるモーダルウィンドウ「Block Slide」

    Block SlideというjQueryプラグインを使えば印象的なエフ…

  3. makefixed.js

    JavaScript

    スクロール中に要素を固定配置できるjQueryプラグイン「makefixed.js」

    makefixed.jsはスクロール中に指定した要素を固定配置させるこ…

  4. Animated Intro With jQuery

    JavaScript

    プログレスバーつきのカッコいいイントロページを実装する「Animated Intro With jQ…

    シンプルなアニメーションがとてもカッコいいイントロページを実装する「A…

  5. Houdini

    JavaScript

    シンプルな折りたたみ・展開やアコーディオンを実装できる「Houdini」

    Houdiniはシンプルな折りたたみ・展開ができる機能やアコーディオン…

  6. Philter

    JavaScript

    CSSのフィルターをコントロールできるjQueryプラグイン「Philter」

    PhilterはCSSのフィルターを簡単にコントロールすることができる…

コメント

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

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

最近の記事

  1. JOK-350 WH
  2. 1460 COLLAR ウォータープルーフ 8ホールブーツ
  3. スターバックス ハウスブレンド

アーカイブ

PAGE TOP