フォントサイズを変える「大・中・小」ボタンを実装する方法
知り合いのデザイナーさんに、「大・中・小」のボタンでフォントサイズを変更する方法ってどうやるのですか？という質問をいただきました。 CSSとJavaScript（場合によってはJSのみ）で簡単にできてしまうので、サンプルをご紹介しておきます。 フォントサイズを変える「大・中・小」ボタン実装 jQueryを使ってフォントサイズを変える「大・中・小」ボタンをサクサクっと実装してみようと思います。 まずは仕様を考えてみましょう。 仕様 ・大・中・小のボタンをクリックするとフォントサイズが変更される ・それぞれのボタンにIDをセットしておき、そのID名をもとにclassをセット ・CSSにあらかじめ各class用のフォントサイズを入れておく ・再度訪れたとき、クッキー情報があればそのサイズ、なければ中サイズを。 スタイルシートごと変更する方法もあるのですが、今回はCSSとclassでセットで対応し
jQueryでテキストにエフェクトをかけたりアニメーションさせたりするプラグイン集:phpspot開発日誌
jQueryでテキストにエフェクトをかけたりアニメーションさせたりするプラグイン集が色々まとまったエントリが公開されており、それぞれ便利に使えそうです。 テキストエフェクト 画像を使わずにJavaScriptやCSSを駆使してテキストにエフェクトを加えるものが色々。 FontEffect jQuery Plugin アウトラインや影、グラデーション効果をJavaScriptでかけることが可能。 jQuery Label Effects 文字を盛り上がりや影付きにしたりできます Text-shadow in IE with jQuery IEでテキストを影付きにする例 Codename Rainbows グラデーションなど様々なテキストエフェクトをかけることが可能 Textgrad – A jQuery Text Gradient Plugin テキストにグラデーション効果を自由自在に与える
フォントサイズを調整するJavaScript「fontScaler」
twitter facebook hatena google pocket フォントのサイズをユーザーが調整できるサイトは多いですが、大中小と制作者側で決めてしまってよいのでしょうか？ jQueryプラグイン「fontScaler」は+-でも調整が可能です。 sponsors 使用方法 fontScalerからファイル一式をダウンロードします。 <link rel="stylesheet" type="text/css" href="jquery.fontSizer.css" media="screen" /> <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.fontScaler.js"></script> <script ty
JavaScriptで文字サイズを変更する「jQuery Text Resizer Plugin」
twitter facebook hatena google pocket サイトでよく見かける、文字サイズ（大・中・小）。 文字サイズが変更できるとなんだかユーザビリティに配慮した気になれます。 JavaScriptライブラリの「jQuery」プラグインjQuery Text Resizer Pluginを使用して実現してみましょう。 sponsors 使用方法 jQuery Text Resizer Pluginからファイル一式をダウンロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.textresizer.js"></script> <script type="text/javascript" src="jq
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
