Crimson Report

<< 擬フレの基礎論【1】 | 研究者と助手 >>


スポンサーサイト

Fri 18 11, 2005

Permalink : http://sug.jugem.cc/?eid=

一定期間更新がないため広告を表示しています

| posted at | filed under - | - | - |

Latest entry


擬フレの基礎論【2】

Sat 30 10, 2004

Permalink : http://sug.jugem.cc/?eid=147

ギャグ抜きでお送りしております、緋色の研究です。なんか書いていて息が詰まる感覚をぬぐいきれません。引き続き、IEでの固定ボックスの作成について。

かなり乱暴だが、画面に表示されるもの=すべてbodyに内包されているもの、として考えてみよう。

ウィンドウの高さ以上の文章や画像があった場合に、htmlがscrollしbodyがvisible(内容の高さにあわせて変化)するということは、body自身が上下(左右)移動していることになる。さらに、画面に表示されるものはbodyの左上を基点として順次配置・描画されていくので、土台であるbodyのスクロールと共に移動する。

これをbodyがスクロールするように設定すれば基点の位置は変わらない(bodyは動かず内容物が移動する)ゆえにbody直下に置き、基点から絶対配置にしたボックスもスクロールには影響されない。

[ CSS ] (IE用)

html {
overflow: hidden; /* スクロールさせない */
}
body {
height: 100%; /* 高さを指定 */
overflow: auto; /* あふれた場合はスクロール */
}
#menu {
display: block;
position: absolute;
top: XXpx; left: XXpx;
width: XXpx; height: XXpx;
}
#contents {
display: block;
width: XXpx; height: XXpx;
overflow: auto;
}

高さを指定したボックスをoverflow: auto;に設定した場合、ブラウザが判断して表示法を決める。(多くのブラウザでは高さ未満ではスクロールバーは表示されない)scrollに設定すると常時スクロールバーが表示される。また、高さを指定しないボックスにoverflow: auto;を設定した場合は内容の高さまでボックスが広がる。

bodyをスクロールさせるということは、絶対配置のボックスがなければ見た目は通常のHTML文章となんら変わりはない。よって例の#contentsのように記事部分をスクロールさせるボックスは不要になる。スクロールバーはbodyのものが出るだけ(もちろんあふれなければ何も出ない)で画面をシンプルに見せることができる。

以下次号

関連記事

| posted at 22:27 | filed under Memo | comments(0) | trackbacks(0) |


スポンサーサイト

Fri 18 11, 2005

Permalink : http://sug.jugem.cc/?eid=

| posted at | filed under - | - | - |


Comments & Trackback


Search this site

about this site

Categories

Archives

Appddix