JavaScript

テキストを中央に向かうにつれて大きくしたりできるjQueryプラグイン「jqIsoText」

結構おもしろかったのでメモしときます。テキストに簡単なエフェクトをかけてくれるjQueryプラグイン「jqIsoText」です。テキストを中央に向かうにつれて大きくしたり、またはその逆にしたりすることができます。画像ではなくてテキストなのでちょっとした変更も簡単にできるのでいいですね。以下使い方です。

[ads_center]

使い方

使い方はこれ以上ないくらい簡単です。jQueryとプラグインを読み込みます。

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jqIsoText.js" type="text/javascript"></script>

エフェクトをかけたいテキストです。

<div class="sample">sampletextsampletext</div>

あとはプラグインをセットして完了です。

<script>
$(".sample").jqIsoText();
</script>

オプション

オプションは全部で3つあります。

fromSize

一番小さい文字サイズを指定します。

toSize

一番大きい文字サイズを指定します。

split

yesかnoを指定します。デフォルトはnoです。yesにするとスペースで文字を区切った時にまた最初からエフェクトがかけられます。

以下はオプションです。

<script>
$(".sample1").jqIsoText();
$(".sample2").jqIsoText({fromSize: 50, toSize: 10});
$(".sample3").jqIsoText({fromSize: 5, toSize: 100});
$('.sample4').jqIsoText({fromSize: 50, toSize: 10, split: 'yes'});
</script>

ということで、大胆に使ってみてもいいし、ちょっとしたアクセントにも使えるのでオススメです。以下からダウンロードできます。

タイポグラフィを向上させるjQueryプラグイン15前のページ

Google マップを簡単でシンプルに使えるようにしてくれる「gmaps.js」次のページ

最近の記事

  1. ホワイトチョコマカダミアドーナツ
  2. エッグペペ
  3. ダークチョコレート
  4. 朝のコーヒー
  5. ザンビア
PAGE TOP