通りすがり1号
2000/01/24(月) 00:30:32
んー。
GoLive使ってますねぇ。
ひどいコードを吐き出すなぁ。
まず、HTMLがあまり良くないところ。
1)<H3>でフォントを太くしてる。
2)<div>野中の全要素を<center>で挟んでる。
3)一続きの文章を<p>を使って改行している。
CSSについては、値を%で指定すると
NN4が上手く拾ってくれないときがあります。
JavaScriptについては、ソース追っかけるのが面倒なので
書き直しました。
動作確認はIE5とNC4.07で行ってます。
<html>
<head>
<style type="text/css">
#layer {
position: absolute;
top: 0px;
left: 0px;
width: 200px;
height: 200px;
clip: rect(0px 200px 200px 0px);
layer-background-color: #44ff88;
background-color: #44ff88;
font-weight: bold;
text-align: center;
}
</style>
<script>
function MoveToLayer(layName,x,y){
if(document.layers)document.layers[layName].moveTo(x,y);
if(document.all){
document.all(layName).style.pixelLeft=x;
document.all(layName).style.pixelTop=y;
}
}
function GetClientWidth(){
var pageWIDTH=null;
if(document.layers) pageWIDTH=window.innerWidth;
if(document.all) pageWIDTH=document.body.clientWidth;
return pageWIDTH;
}
function GetClientHeight(){
var pageHEIGHT=null;
if(document.layers) pageHEIGHT=window.innerHeight;
if(document.all) pageHEIGHT=document.body.clientHeight;
return pageHEIGHT;
}
function GetWidth(layName){
if(document.layers) return document.layers[layName].clip.right;
if(document.all) return document.all(layName).clientWidth;
}
function GetHeight(layName){
if(document.layers) return document.layers[layName].clip.bottom;
if(document.all) return document.all(layName).clientHeight;
}
function MoveCenter(layName){
x = (GetClientWidth()-GetWidth(layName))/2;
y = (GetClientHeight()-GetHeight(layName))/2;
MoveToLayer(layName,x,y);
}
</script>
</head>
<body onLoad="MoveCenter('layer')" onResize=location.reload();>
<div id="layer">
センタリングします<br>
<br>
Windowをリサイズして！<br>
<br>
でもNNはバグっぽい<br>
</div>
</body>
</html>
通りすがり1号
2000/01/24(月) 22:44:36
はあ、、、これだけはやりたくなかったが、、、
苦し紛れの解決法です。
どうしても駄目なときはこれで確認してみてください。
NN4出れイヤーを極端に小さくしたときにも対応しています。
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<meta name="generator" content="Adobe GoLive 4">
<title></title>
<style type="text/css">
#layer {
position: absolute;
z-index: 1;
top: 10px;
left: 50px;
visibility: visible
}
td {
background-color: #0c9;
text-align: center;
}
</style>
</head>
<body onresize="location.reload()">
<div id="layer">
<table width="200" height="100"><tr><td>
サンプル変更しました<br>
<br>
これではどう？
</td></tr></table>
</div>
</body>
</html>