CSSでブログデザイン

IE6で「position:fixed;」を実現

IE6では使えない psition:fixed;(ボックスを画面上の任意の地点に固定する)を実現する方法です。

今までbodyをheight:100%にする方法はありましたが、レイアウトが複雑になってくると不具合がおきることが多かったので、使わずにいました。
ところがもっと簡単な方法があったんですね。ただしJavaScriptがONになってないと使いませんが。。。

position: fixed;
top: 0;
left: 0;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop+0));

IE6以外のブラウザではアンダースコア( _ )の付いたスタイルは無視するので、普通にfixedが適用されます。

IE6ではスクロールのたびにtopの座標を画面の上部から0pxに指定するので、absoluteでもfixedと同じ効果が生まれます。
ただしこのままだとスクロールのたびに固定したボックスがガタガタしますので、以下のようにbodyの背景にfixdを指定してやると解決します。
body {
background: url(null) fixed; /* 画像はあっても無くても可 */
}

参考サイト
IEで固定座標を指定する方法

Comments

コメントの投稿
管理者にだけ表示を許可する

Trackbacks

Trackback URL
http://season.14.dtiblog.com/tb.php/42-61eb0b92

Profile

CSSでブログデザイン
Administrator
Customan
Profile
性別:男性
年齢:謎
職業:謎
趣味:HP作成、自転車

しばらくの間テンプレート作成は休んでいましたが、また復活しました。

About

ブログのカスタマイズやCSSに関する内容です。


Reference


Calendar

PREV≪  2008-07  ≫NEXT
S M T W T F S
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -

Recent Entries


Categories


Monthly Archive


Recent Comments


Recent Trackbacks


Links


Feed


RSS 1.0


Advertisements


背景画像のサムネイル 画像をクリックすると背景が変わります

写真画像著作権: 『風のおひるね』 Kazuhiko Sano

CLOSE