フォントサイズを変える「大・中・小」ボタンを実装する方法
知り合いのデザイナーさんに、「大・中・小」のボタンでフォントサイズを変更する方法ってどうやるのですか？という質問をいただきました。 CSSとJavaScript（場合によってはJSのみ）で簡単にできてしまうので、サンプルをご紹介しておきます。 フォントサイズを変える「大・中・小」ボタン実装 jQueryを使ってフォントサイズを変える「大・中・小」ボタンをサクサクっと実装してみようと思います。 まずは仕様を考えてみましょう。 仕様 ・大・中・小のボタンをクリックするとフォントサイズが変更される ・それぞれのボタンにIDをセットしておき、そのID名をもとにclassをセット ・CSSにあらかじめ各class用のフォントサイズを入れておく ・再度訪れたとき、クッキー情報があればそのサイズ、なければ中サイズを。 スタイルシートごと変更する方法もあるのですが、今回はCSSとclassでセットで対応し
リンクを自動で超分かりやすく修飾してくれるJSライブラリ「DLINK」:phpspot開発日誌
-DLINK- automatic link improver - OOPStudios.com リンクを自動で超分かりやすく修飾してくれるJSライブラリ「DLINK」。 次のように、リンクをJavaScriptで自動で色分け&アイコン付与してくれます。<a>タグにclassを指定する必要もありません。 PDF、Flash、SWFなど、各種フォーマットも自動付与。 設置方法は簡単で、以下の３ステップ。 1. まずスクリプトを読み込む <script type="text/javascript" src="http://oopstudios.com/dlink/dlink.js"></script> 2. 色分けしたい部分をdiv.dlinkで囲う 中身に普通にHTML記述 <div class="dlink"> your <a href="#">link filled</a> conten
データが分かりやすい、グラフやチャートにする10のスクリプト | コリス
WebTeckerのエントリーから、JavaScript, Flash, Silverlight, PHPなどを使用して、グラフやチャートなどにデータをビジュアル化するスクリプトの紹介です。
マックOSのドック風のメニューが作れる『MacStyleDock.js』 | IDEA*IDEA
ドットインストール代表のライフハックブログ
優雅なWeb制作のためのJavaScript「yuga.js」:phpspot開発日誌
inputlog - yuga.js 0.5.1 - 優雅なWeb制作のためのJavaScript バージョンアップはこそこそしていたりする優雅なWeb制作のためのJavaScript yuga.jsの0.5.1を公開します。 優雅なWeb制作のためのJavaScript「yuga.js」のバージョンアップがなされたようです。 csshappylife さんによる デモページをみると、なかなか便利そうです。 以下のようなことが出来るようです。 画像のロールオーバーを簡単にする機能 外部リンクは別ウィンドウを自動で設定 画像のリンクをthickboxで開くよう簡単設定 偶数、奇数行を自動で色分け ページ内リンクのアニメーション機能 サイト作成時の面倒な部分の作業を軽減できそうですね。
CSS レイアウト切り替えスイッチ | WWW WATCH
Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレ... Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレイアウトの 3種類がよく使われますが、どのレイアウトが一番文章が読みやすかったり、利便性が高いのかって考えたときに、当然好みは人それぞれ。 じゃあ、その人の好みで、3つのレイアウトを切り替えられるようにしたらいいじゃんということで、そんな CSS 切り替えスイッチを作ってみました。 サンプルはこちらで確認できます 全ファイルのダウンロードはこちら （zip ファイル / 10KB） デフォルトでは横幅固定のレイアウトになっています。スイッチを押すたびにレイアウトが選択
サイトのサイトマップページをCSSとJavaScriptで分かりやすくツリー状にする「Sitemap Styler」:phpspot開発日誌
サイトのサイトマップページをCSSとJavaScriptで分かりやすくツリー状にする「Sitemap Styler」 2007年10月11日- Css Globe - Sitemap Styler: Style your Sitemaps with CSS and Javascript I believe that it isn't necessary to point out the benefits of having a sitemap somewhere on your site.サイトのサイトマップページをCSSとJavaScriptで分かりやすくツリー状にする「Sitemap Styler」 スタイルなしの状態のリストを美しくツリー状に整形できます。 JavaScript によってツリーがクリックで開閉できます。 3種類の違うスタイルのサンプルが公開されているのでお好みのサンプ
角を丸めるjavascript「Nifty Corners Cube」
twitter facebook hatena google pocket Web2.0と言われて増えたのが、グラデーション、画像を水面に映ったかの様に反射させる、透過などなど。 そして角を丸くすること。 Nifty Corners Cubeが提供するのはそんな角丸作成javascript。 sponsors 使用方法 Nifty Corners Cubeからダウンロードしたniftycube.jsとniftyCorners.cssを同じディレクトリにアップロード。 （もしくは、niftycube.jsのl.setAttribute("href","niftyCorners.css");）を絶対パスに） 次にheadに以下のスクリプトを書き込みます。 <script type="text/javascript" src="http://yourdomain/niftycube.js"></
class属性指定で簡単に画像エフェクトをかけられる「Corner.js」:phpspot開発日誌
Corner.js Corner.js 1.0 allows you to add corners to images on your webpages. It uses unobtrusive javascript to keep your code clean. class属性指定で簡単に画像エフェクトをかけられる「Corner.js」。 classに courner や ishadow40 , inverse などの値を指定＆組み合わせすることで次のように画像に簡単にエフェクトをかけられます。 javascriptファイルを読み込んで置くだけであとは class 名指定をするだけで画像にエフェクトをかけられるということでなかなか便利ですね。 ただし、ＩＥでは使えないようなので注意が必要です。 関連エントリ 注目！Flashを応用してHTML＆CSSだけでは通常作れない画像効果を得る「
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
