エラスティックレイアウトでイメージを自動で拡大する方法 | ユージック
エラスティックレイアウトでイメージを自動で拡大する方法 2007年2月28日 文字サイズを拡大したときにレイアウト幅も伸縮するエラスティックレイアウトの手法は以前ご紹介しましたが、ヘッダーなどでイメージを使った際はイメージは伸縮しないのであまり使えないなと思われているかと思います。 そこで今回は文字サイズを変更してイメージも拡大する効果を得れるライブラリｓｗIRをご紹介します。 ｓｗIRはFLASHとJavascriptを利用した様々なエフェクトをimgに与えれる優れものです。今回はエラスティックレイアウトの画像に対応する部分だけをご紹介します。 使い方はいたって簡単です。まずTOPページでダウンロードできるswfIRを解凍し、サーバーの同一フォルダにswfir.jsとswfir.swfをアップロードします。そしてswfir.jsを読み込んでJavascriptで効果を記述します。以下はh
2xupで実装されているエラスティックレイアウトを調べてみた。 - Trans
2xupさんのところで実装されているエラステックレイアウト（Elastic Layout）、もしくはエラステックデザイン、はたまたエラスティックレイアウトというのが気になってしょうがない。今年、アックゼロヨンでグランプリを受賞したみずほ証券でも、似たようなレイアウトが施されている。というわけで、またもや調べてみた。 と、調べてみたはいいものの、うまい具合に実装方法について解説されているサイトが見つからなかった。要は、widthやpadding、marginなどにem指定をして、フォントサイズを変更しても、それに応じてレイアウト幅が変更されるレイアウトのことを言うらしい。A List Apart: Articles: Elastic Designで発表されたのがどうも初めてのようだ。ちなみに、作者が作ったサンプルサイトもある。 でも、456 Berea Streetでよい感じに、自分のサイト
ウノウラボ Unoh Labs: エラスティック・レイアウトのご紹介
yamaokaです。 エラスティック・レイアウトというwebサイトのレイアウト手法をご存知でしょうか？ 「エラスティック（elastic）」とは、ゴムのように弾力性がある状態のことです。 言い換えると「伸び縮みするレイアウト」になるでしょうか。 webサイトの代表的なレイアウト手法として、次の2つが挙げられるかと思います。 固定幅レイアウト リキッド・レイアウト 固定幅レイアウト 固定幅レイアウトでは、 コンテンツを格納するボックスの幅を以下のように絶対値で指定します。 div#container { width: 800px; } 固定幅レイアウトの場合、ウィンドウや文字のサイズが変更されてもレイアウトの枠は変わりません。 したがって、ウィンドウを大きくすると表示されるエリアが小さくなってしまったり、 文字のサイズを変更すると外枠が変わらないので読みづらくなってしまったりします。 リキ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
エラスティックレイアウトのベーシックテンプレート - Webテンプレート - 仮想空間