Re: [報告 2/2]フレーム非対応のブラウザと擬似フレーム動作
どうも。氷炎 雷光風(ひえん らいこふ)こと笠原です。
Message-ID: <c45ihk$kcs$1@news00.iij4u.or.jp>
において、すぎたさんは書きました。
> > #right {
> > position: absolute;
> > left : 16.7em;
> > top : 0px;
> > height: 100%;
> > overflow: hidden;
> > background-color : #DFFFF6;
> > border: thin solid #FFFFFF;
> > }
>
> ここの height と overflow の行は削除してください。
>
>
> > function getStyleByName(name) { // Gecko&IEテスト用
> > var rule = (document.all ? 'rules' : 'cssRules');
> 〜 略 〜
>
> > if (getStyleByName('#left-top').position != 'fixed') {
> 〜 略 〜
>
> ここは Opera には対応してなくて、実際のプログラムでも
> Opera の場合は呼び出してません。
> テストで使用する以外は削除した方がスッキリします。
> # Opera7 は、なぜか正式版以降、インストールは出来ても
> # 動作しなくなってしまった(betaはOK)ので…
すぎたさんの記事に従って、CSSとjavascriptを書き出してみると、
末尾のような形で良いのでしょうか?
それらを試した結果、ウチのOpera7.23は、動作してくれました。
特に以前のものでは、rightの部分がスクロールできなかったのが、
スクロールできるようになっていて、すごく驚きました。
「Operaでスクロールしてる」って。
すぎたさん、ありがとうございます。m(_)m
〜〜〜ここからCSS〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
/*fjapanihon用スタイルシート*/
/*固定表示関係*/
body {
margin : 0px;
padding: 0px;
}
#left-top {
position: fixed;
left : 0.5em;
top : 0px;
width : 16em;
height: 156px;
background-color : #FDFFE9;
border: thin solid #FFFFFF;
}
#left-bottom {
position: fixed;
left : 0.5em;
top : 160px;
width : 16em;
background-color : #FFC9F7;
border: thin solid #FFFFFF;
}
#right {
position: absolute;
left : 16.7em;
top : 0px;
background-color : #DFFFF6;
border: thin solid #FFFFFF;
}
/*見出し関係*/
h1 { font-size : medium; float: left; }
h2,h3 { font-size : medium; }
th { font-weight: normal; }
/*定義リスト関係*/
dt { font-weight: bold; }
/*大きさ・太さ関係*/
.small { font-size : smaller; }
.bold { font-weight: bold; }
〜〜〜ここまでCSS〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
===ここからjavascript=======================
<script type="text/javascript">
<!--
function init() {
var d = document;
if (!d.getElementById) { // IE4
d.getElementById = function (id) { return d.all[id]; }
}
var lt = d.getElementById('left-top' );
var lb = d.getElementById('left-bottom');
var r = d.getElementById('right' );
var ie = false;
var tid = null;
var b;
function movepos() {
lt.style.top = b.scrollTop + 'px';
lb.style.top = b.scrollTop + 160 + 'px';
if (!ie)
setTimeout(movepos, 200);
}
function scrollchk() {
if (tid) clearTimeout(tid);
tid = setTimeout(movepos, 250);
}
if (window.opera) { // Opera
switch (document.compatMode) {
case undefined : // Opera6
case 'QuirksMode': // Opera7互換
case 'BackCompat': // Opera7互換
b = document.body;
break;
default: // Opera7標準
b = document.documentElement;
break;
}
} else if (document.all) { // IE
ie = true;
switch (document.compatMode) {
case undefined : // IE4,IE5
case 'BackCompat': // IE6互換
b = document.body;
break;
default: // IE6標準
b = document.documentElement;
break;
}
lt.style.position = 'absolute';
lb.style.position = 'absolute';
window.onscroll = scrollchk;
} else { // NN
switch (document.compatMode) {
case undefined : // NN6??
case 'BackCompat': // NN7互換
b = document.body;
break;
default: // NN7標準
b = document.documentElement;
break;
}
}
}
-->
</script>
===ここまでjavascript=======================
ではでは。
--
笠原 励(氷炎 雷光風/ひえん らいこふ)
cuncuku@uranus.interq.or.jp −受信専用−cuncuku@yahoo.co.jp
2004/3/29 リンク 検索系2件、fj.*系にa crevice of Web、
nihon.*系にnihon.* official website追加。
3/28 リンク fj.*系にfj.*委員会、弥白通信、書斎追加。
3/27 fjapanihonリニューアル終了!新しいURLは
http://www.interq.or.jp/uranus/cuncuku/nihongo/fjapanihon_top.html
Fnews-brouse 1.9(20180406) -- by Mizuno, MWE <mwe@ccsf.jp>
GnuPG Key ID = ECC8A735
GnuPG Key fingerprint = 9BE6 B9E9 55A5 A499 CD51 946E 9BDC 7870 ECC8 A735