Squishy

JavaScript

テキストをコンテナに合わせて自動でサイズ変更してくれるjQueryプラグイン「Squishy」

SquishyというjQueryプラグインを使えばテキストをコンテナに合わせて自動でサイズ変更させることができます。レスポンシブなデザインにしたい時にも活用できそうですね。手軽にフォントサイズをコンテナに合わせてくれるので便利です。

[ads_center]

Squishyの使い方

Squishy

Squishy

HTMLで適用したい要素を記述します。

<p class="sample">sample</p>

head内にjQuery本体とダウンロードしたプラグインを読み込んだ状態で、以下のようにSquishyをセットすればOKです。

<script type="text/javascript">
$(function() {
    $(".sample").squishy();
});
</script>

オプションではmaxWidth、minWidth、maxSize、minSizeなんかを指定することができます。

$(".squishy").squishy({maxWidth: 200, minSize: 20});

コンテナいっぱいにテキストを配置したい時なんかに覚えておきたいですね。

関連記事

  1. Responsive Parallax Drag-slider With Transparent Letters
  2. PWS Tabs jQuery Plugin
  3. Grasp Mobile Progress Circle
  4. Image Gallery Threejs
  5. Smooth Anchor Scrolling

    JavaScript

    ページ内リンクをスクロールできる「Smooth Anchor Scrolling」

    ページ内リンクをスムーズにスクロールできる「Smooth Anchor…

  6. waslidemenu

最近の記事

  1. 落ち葉と雪
  2. SOL001
  3. 末廣ラーメン

アーカイブ

PAGE TOP