Netscape6対策室

2000年11月19日:新掲載(Netscape6(ネットスケープ6)におけるJavaScriptレイヤー操作方法)
2000年11月26日:改定(Netscape6におけるJavaScriptキーボードの入力の注意点を追加)
2000年11月29日:改定(IE5は、IE4及びNN6の2種類と同じが可能)


1. Netscape6(ネットスケープ6)におけるJavaScriptレイヤー操作方法

Netscape6では、従来のNetscape4.Xで使用できていたdocument.layer[]が使用できなくなりました。 対処方法がわかりましたのでその方法をご説明します。

(1)IE、Netscape4.X、Netscape6のレイヤー処理の分岐

if (document.all) {  < IE4/IE5の処理記述 >  }
if (document.layers) {  < Netscape4.Xの処理記述 >  }
if (document.getElementById) {  < Netscape6/IE5の処理記述 >  }

IE5は従来のIE4と同じ「document.all」とNetscape6と同じ「document.getElementById」と両方に対応していますので、 処理がダブらないように注意してください。

(2)レイヤー座標の設定

(a)IE4/IE5

変数=document.all("レイヤ名").style.top; //y座標
変数=document.all("レイヤ名").style.left; //x座標

(b)Netscape4.x

変数=document.layers["レイヤ名"].top; //y座標
変数=document.layers["レイヤ名"].left; //x座標

(c)Netscape6/IE5

変数=document.getElementById("レイヤ名").style.top; //y座標
変数=eval(styleElement.split("p",1)); //単位がpxの場合の数値取出し
変数=document.getElementById("レイヤ名").style.left; //x座標
変数=eval(styleElement.split("p",1)); //単位がpxの場合の数値取出し

(3)レイヤー内のイメージ、フォームの設定

(a)IE

ddocument.images[イメージ名].src="画像ファイル指定"; //イメージ
ddocument.images[イメージ名].src="画像ファイル指定"; //イメージ

(b)Netscape4.x

document["レイヤ名"].document.images["イメージ名"].src="画像ファイル指定"; //イメージ
または
document.layer["レイヤ名"].document.images["イメージ名"].src="画像ファイル指定"; //イメージ

(c)Netscape6

IEとまったく同じ記述で良くなりました。
すなわち、レイヤー指定をせずに直接イメージやフォーム名を指定すれば良いです。

(3)キーボード入力

ネットスケープ6のキーボード入力は、以下の通りです。

・プログラムコードについては、ネットスケープ4.xと同じです。
・テンキーの入力文字コードは、IEと同じになりました。
・矢印キーも対応されました。(IEと同じ入力文字コード)



2.Netscape6におけるJavaScriptキーボードの入力の注意点

Netscape6の場合、起動時のキーボードの入力のフォーカス領域は、アドレスバー(URL入力域)になっているため、 画面内でマウスの右クリックを行わないと、JavaScriptへのキーボードの入力が行われない状態になってしまう。
また、alert等によってメッセージを出力した直後も画面内でマウスの右クリックを行わないと、 JavaScriptへのキーボード入力が行われない状態になってしまう。

「立ち上がり時」及び「alert等の出力直後」に以下の処理を行うことによって、 キーボードの入力が可能な状態となります。

document.forms[0].elements[0].focus();
document.forms[0].elements[0].blur();

フォームエレメントにフォーカスしてすぐに解除しているだけです。
このため、INPUT等のフォームエレメントが存在しないとできません。


3.Netscape6(ネットスケープ6)におけるHTML、JavaScript変更点

ネットスケープ6のHTML及びJavaScloptの違いは下記サイトに一覧表が記載されていますので参考願います。下記に表のみ転記しています。

http://www.gerbilbox.com/newzilla/webdesign/general05.php

Netscape 6にサポートされていないものは何?

(2000年8月16日水曜日現在)

HTML

使用不可 代替方法
<layer> </layer> <div> </div>
<nolayer> </nolayer> なし
<ilayer> </ilayer> <iframe> </iframe>
<blink> </blink> Cascading Style Sheets 1: text-decoration: blink;
src= attribute of <div>, <layer> and <ilayer>
(<div> is supported)
src= attribute in <iframe>
<marquee> <div> with content string rotated over time by JavaScript via the DOM level 1
<bgsound> <embed> for compatibility with older browser, but strongly suggest using <object>

JavaScript & DOM

使用不可 代替方法
document.layers[]
document.all
document.getElementById()
element.visibility = value; element.style.visibility = value;
element.left
element.style.pixelLeft
parseInt (element.style.left)
element.top
element.style.pixelTop
parseInt (element.style.top)
element.moveTo(x, y);
element.style.pixelLeft = x;
element.style.pixelTop = y;
element.style.left = value + "px";
element.style.top = value + "px";
document.tags
document.ids
document.classes
document.contextual()
document.styleSheets[].addRule
適切な規則を文書のHEADの書式シートに付加するDOMレベル2のCSSインタフェースを使ってください。例えば:
<html><head><title>Demo</title>
<style id="ietssxyz" type="text/css"></style>
<script language="JavaScript" type="text/javascript"><!--
var targetStyleSheetID = "ietssxyz";
function addRuleToStyleElement (name, selector, declaration)
{
  var styleSheetElement = document.getElementsByID(name);
  var styleSheetLength = styleSheetElement.length;
  styleSheetElement.insertRule (selector + " { " + declaration + " } ",   styleSheetLength);
}
addRuleToStyleElement (targetStyleSheetID, "H1", "font-size:44pt");
//--></script>
handleEvent() dispatchEvent()

戻る