画面サイズによってフォントサイズを変更する「FitText」
当ページのリンクには広告が含まれています。
スポンサーリンク
画面サイズによってフォントサイズをフレキシブルに変更するjQueryプラグイン「FitText」を紹介します。
jQueryプラグイン「FitText」
このプラグインを使えば、ブラウザの横幅に応じてテキストのフォントサイズが自動的に変更されます。
レスポンシブデザインをつくるときに便利ですね。
スポンサーリンク
デモページのブラウザを縮めるとテキストのフォントサイズをぐいぃーと変更されます。フォントサイズの変化を堪能してください。
デモのソース(HTML + jQuery)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>FitText - jQueryプラグインまとめのカルマ</title>
<style>
h1 {
text-align: center;
text-transform: uppercase;
display: block;
}
</style>
</head>
<body>
<h1 id="fittext">jQueryプラグイン</h1>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="js/jquery.fittext.js"></script>
<script type="text/javascript">
$("#fittext").fitText();
</script>
</body>
</html>
スポンサーリンク