Crimson Report

<< リバース・チョップ・スティック | 擬フレの基礎論【1】 >>


スポンサーサイト

Fri 18 11, 2005

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

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

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

Latest entry


擬フレにまつわるエトセトラ

Thu 28 10, 2004

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

私は帰ってきた。がお客さんも帰ってしまったようだ。前回のお題

いままでは横割りのフレームでトップに固定メニューを置いていたのですがJUGEMのテンプレートhttp://sample12.jugem.cc/を改造して同じようにする方法はあるでしょうか?

に対して中途半端になった擬似フレームついて、やっつけておく。

あるボックス#menu(たとえばメニュー部分)の表示を固定させたい場合、CSSに

#menu {
display: block;
position: fixed;
top: XXpx; left: XXpx;
width: XXpx; height: XXpx;
}

と設定すればよい。

FF

fixedしてないボックス(記事部分)の高さがウィンドウを越えれば勝手にスクロールバーが出て、希望の動作になる。ところが、肝心のシェアNO.1(w)のIEがこのプロパティをノンサポート。そこで、UAがIEだった場合にはoverflowプロパティで擬似フレーム化する方法をとる。以前はこの部分でつまづき、道を外れ側溝のどぶにはまり、酒に溺れ(デフォルトだが)、忌まわしい過去にフタをし、北国の港町で名前を変え身を潜め暮らしていた。だが、いつまでもシッポを巻いて逃げているわけにはいかない。なぜなら私にはシッポがないからである。

一般的Blogのサイドバー型ナビゲーションならスクロールすれば目的のメニューにたどりつけるし、トップ水平型ナビゲーションならばスクロールもしくはページトップへのリンクさえ備えればワンクリックでメニューを表示できる。ちなみに私は、非固定(って言葉が変だが)トップメニューこそ、本来の縦スクロール型読み物であるhtmlと親和性が高いと思っている。

さて、先人たちが数々の方法を開発してきたが、現実に擬似フレームを使用しているサイトはごくわずかだ。その理由は

  • なにがなんでも固定部分が必要、という状況・理由が発生しないから
  • クロスブラウザなコードを書くのが難しい(あるいは面倒くさい)
  • 常に画面の一部が占有されていると、低解像度の環境にやさしくない

というところか。

それ以外にもタッチパッド・マウスホイールが効かなくなったり、内部アンカーの動作が不自然になるなど問題が多い。これから数回は、このテンプレを使ってこれらの問題点について研究していきたい。

ということで現時点でのソース。(このまま使うには勇気が必要)

[ HTML ]

[ CSS ]

| posted at 21:53 | filed under Design | comments(4) | trackbacks(10) |


スポンサーサイト

Fri 18 11, 2005

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

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


Comments & Trackback

  1. - : 管理者の承認待ちコメントです。

  2. - : 管理者の承認待ちコメントです。

  3. - : 管理者の承認待ちコメントです。

  4. - : 管理者の承認待ちコメントです。


  1. - : -
    管理者の承認待ちトラックバックです。

  2. - : -
    管理者の承認待ちトラックバックです。

  3. christmas gifts : christmas ornaments
    ?????????ヲ???????

  4. - : -
    管理者の承認待ちトラックバックです。

  5. - : -
    管理者の承認待ちトラックバックです。

  6. mortgage : credit card debt
    ?????????ヲ???????

  7. ringtone : askjeeves
    ?????????ヲ???????

  8. - : -
    管理者の承認待ちトラックバックです。

  9. Enarmet tyvekn詒t gcqy : Enarmet tyvekn詒t
    Enarmet tyvekn詒t

  10. asino polonia wrocła snne : casino polonia wrocław
    casino polonia wrocław

Search this site

about this site

Categories

Archives

Appddix