※ ChatGPTを利用し、要約された質問です(原文:XHTMLとJavascript・CSSで表示位置の固定方法について)
XHTMLとJavascript・CSSで表示位置の固定方法について
このQ&Aのポイント
HTMLからXHTMLへソースをそのままで移行したら位置の固定がされなくなりました。
<div id="msg">message</div>の部分をスクロールしても常に同じ場所に表示したいです。
XHTMLの知識が殆どなく、原因が判りません。修正方法、もしくは代替案をお願いします。宜しくお願いいたします
XHTMLとJavascript・CSSで表示位置の固定方法について
HTMLからXHTMLへソースをそのままで移行したら位置の固定がされなくなりました。
<div id="msg">message</div>の部分をスクロールしても常に同じ場所に表示したいです。
XHTMLの知識が殆どなく、原因が判りません。
Javascriptを別ファイルにしても動きませんでした。
修正方法、もしくは代替案をお願いします。
宜しくお願いいたします
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="content-script-type" content="text/javascript" />
<script type="text/javascript">
var offX = 0;
var offY = 0;
function setMenu(){
if(document.all){
var mx = parseInt(document.body.scrollLeft+offX);
var my = parseInt(document.body.scrollTop+offY);
} else {
var mx = parseInt(self.pageXOffset+offX);
var my = parseInt(self.pageYOffset+offY);
}
if(document.getElementById){
document.getElementById('msg').style.left=mx;
document.getElementById('msg').style.top=my;
}else if(document.all){
document.all('msg').style.pixelLeft=mx;
document.all('msg').style.pixelTop=my;
}else if(document.layers){
document.layers['msg'].moveTo(mx,my);
}
}
onscroll = setMenu;
onresize=setMenu;
//-->
</script></head>
<body bgcolor="#111144">
<div id="msg">
message
</div>
</body>
</html>
お礼
動作しました。ありがとうございました。