« 手打ち RSS 始めました。 | Main | ローディング時間を長くしても飽きさせない方法 »

[Inside AoD !] ポップアップフレーム

ポップアップフレームの仕様を一部(背景画像部分)公開。
以下は、Mac風なフレーム番号2と3をベースにしています。

HTMLは単純な3層構造↓
<div class="head iepngfix"></div><div class="body iepngfix"></div><div class="foot iepngfix"></div>
CSSはこちら↓
.AOD2Feeder .head {
	margin: 0;
	padding: 0;
	width: 425px;
	height: 55px;
	background: url(http://www.isella.com/aod2/images/popup_head.png) no-repeat;
}
.AOD2Feeder .body {
	margin: 0;
	padding: 0 30px;
	width: 365px;
	background: url(http://www.isella.com/aod2/images/popup_content.png) repeat-y;
}
.AOD2Feeder .foot {
	margin: 0;
	padding: 0;
	width: 425px;
	height: 50px;
	background: url(http://www.isella.com/aod2/images/popup_bottom.png) no-repeat;
}

という訳で、暇な方は作って送って下さいな。

ちなみに、
※ 上記 .body の background は、PNG の場合、iepngfix の関係で、リピートではなく、無条件に拡大されますので注意して下さい。
※ 上記 .body の padding: 0 30px; が IE6 以下の下位互換モードで変になる原因。直すの面倒臭いので、そのままです。

TrackBack

TrackBack URL for this entry:
http://blog.l-xs.com/cgi-bin/mt/mt-tb.cgi/240

Comments

どもども。
お久しぶりです。
AoD!をWPでも使ってみました。

だぅもだぅも。
お久です。
見ました。
やっぱ毛炉路ですね。

Post a comment