フレームで仕切っているHTMLファイルでeventオブジェクトが思うように使えない

質問

• フレームで仕切っているHTMLファイルにおいて、JavaScriptのeventオブジェクトを使用する際に問題が発生しています。
• マウスポインタが重なると文字が出てくる仕組みを作成しましたが、画面をスクロールさせると表示がずれる問題が発生しています。
• 上下をフレームで仕切っているHTMLファイルにおいて、eventオブジェクトを使う際の表示ずれの解消方法を知りたいです。

回答No.2

hi-ogawa · ベストアンサー

すみません。前回乗せたソースにバグがありました。
スクリプト部分を以下のとおり修正する必要があります。

<script Language="JavaScript">
<!--
function chipHelp(tName, types, evt)
{
if (document.layers){
document.layers[tName].x =evt.x;
document.layers[tName].y =evt.y;
document.layers[tName].visibility = types;
}
if (document.all){
var obj;
var ox=evt.offsetX, oy=evt.offsetY;
obj = evt.srcElement.parentElement;
while(obj.tagName != "BODY"){
ox+=(obj.offsetLeft-1);
oy+=(obj.offsetTop-1);
obj = obj.parentElement;
}
document.all(tName).style.left = ox;
document.all(tName).style.top = oy;
document.all(tName).style.visibility = types;
}
}
//-->
</script>

もともとの問題は、IEの場合 event.x,yで得られる座標がブラウザの
可視領域上の座標であるのに対し、style.top,leftの座標はドキュメント
全体での座標を指しているために起こったようでした。
そこでevent.offsetX,offsetYによりで親エレメントとの相対座標を求め
対応しようとしたのですが、親エレメントがbody以外の場合（tableを使用
しているような場合）、また表示がずれてしまいました。
そこで親エレメントをすべて検索することにより、イベントの起こった場所
のドキュメント全体での座標を求めるようにしました。
ただ、ひょっとしたらもっとよい方法があるのかもしれません。

お礼

ありがとうございました。実際のHTMLファイルはさらに別な仕掛けを使っているので、若干こちらでカスタマイズする必要がありますが、とにかく助かりました。こういうのってどこで勉強されるんですか？私は周りに教えてくれる人がいないので、マニュアル本だけがたよりです。