サンプルページ　　Dynamic Sync Frame

ﾃﾞﾓは、ssheet2.html を開き、ｽｸﾛｰﾙﾊﾞｰを動かします。　　（Home、End、PageUp、PageDown、 ←、↑、↓、→ ｷｰで。）

ﾎｰﾑへ　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Dynamic Sync Frame　　ds_frame.htm（説明ﾌｧｲﾙ）

ﾒｲﾝﾌﾚｰﾑとﾄｯﾌﾟｯﾌﾚｰﾑ、左ﾌﾚｰﾑが連動する Dynamic Synchronized Frame。　　　　Excel風の表、ＸＹ座標表示に最適。　　　　　DHTML+CSS。　　　　　ﾌﾚｰﾑ境界は移動できます。　　　　ｺﾝﾃﾝﾂの追加/変更/削除、ｱﾚﾝｼﾞなどは簡単です。　　　　　　　　all 対応。　　　　　ｺﾋﾟｰ、編集し、簡単にWebで応用できまっ、(^ ^)。

<ご使用方法>

　・　ﾛｰｶﾙ（=PC）への保存は、ssheet2.html、ssleft2.html、sstop2.html、ssmain2.html 、r.gif　を右ｸﾘｯｸ、[対象をﾌｧｲﾙに保存] - 【ﾌｧｲﾙのﾀﾞｳﾝﾛｰﾄﾞ】、【ﾌｧｲﾙ名を付けて保存】 - <保存する場所>： ……、などで。　　　　※: 変わってしまった、ﾌｧｲﾙ名や、*.html 中のﾊﾟｽは要修正。

　・　このDHTMLの実装方法は、ssheet2.html、ssleft2.html、sstop2.html、ssmain2.html をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、ﾎｰﾑﾍﾟｰｼﾞ作成ｿﾌﾄなどのHTML挿入/編集ﾒﾆｭｰなどを使って、新しいﾍﾟｰｼﾞ 1 や hogehoge.html（=任意の挿入先ﾌｧｲﾙ名）の、 <html> ～ </html>　の、～部分にそれぞれ (*1)、(*2)、(*3)、(*4) をﾍﾟｰｽﾄします。ﾌｧｲﾙ名を、ssheet2.html（任意）、ssleft2.html（以下固定）、sstop2.html、ssmain2.html　とします。

　･　編集方法は、hogehoge.html を WordPad や SmipleTextなどのﾃｷｽﾄｴﾃﾞｨﾀｰ、あるいは ”FrontPage Express” などのﾎｰﾑﾍﾟｰｼﾞ制作ｿﾌﾄのHTMLﾀｸﾞ挿入/編集ﾒﾆｭｰで開き編集します。　　　　　ﾄｯﾌﾟと左にｽｹｰﾙや項目を、ﾒｲﾝにﾃﾞｰﾀｰを記述。　　　　　下記の（例） (*1) と、(*2)、(*3) 、(*4)を参考に太字部分の編集を任意に行います。　　　　※: ﾃｷｽﾄｴﾃﾞｨﾀｰによる編集は、HP制作ｿﾌﾄとの互換性の問題を生じません（HP制作ｿﾌﾄ間は少し生じる）。

　・　作動ﾃｽﾄは、ﾛｰｶﾙ（PC）に保存し、 Internet Explorer 10.x～などで開いて。　　　　更新の確認は、Internet Explorerを全て閉じ、再起動を行い、閲覧履歴の削除後に行います。　　　または、【Internet Explorer】- [ﾂｰﾙ] - [ｲﾝﾀｰﾈｯﾄｵﾌﾟｼｮﾝ] - [閲覧の履歴] - [削除] でも。　　　 [F5]ｷｰを押し、最新ﾃﾞｰﾀ読み込み、でも有効な場合があります。

　･　ｱｯﾌﾟﾛｰﾄﾞや作動ﾃｽﾄは、hogehoge.html と同じ階層〔ﾎﾙﾀﾞｰ/ﾃﾞｨﾚｸﾄﾘｰ〕に、使用する画像、*.jsなども転送/配置し実施。　　※：別ﾃﾞｨﾚｸﾄﾘｰに配置時は、*.html 中のﾊﾟｽは要修正。　　　FTPなどで変わってしまったﾌｧｲﾙ名は要修正。　　　　ｽｸﾘﾌﾟﾄ構文中への改行混入は非作動原因。

(*1) ：　ssheet2.html　（例）　　　　　　　挿入先の　<html> ～ </html>　の、～部分にﾍﾟｰｽﾄします。

　HTMLの編集方法　

(*1) をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。

〔この列ﾍﾟｰｽﾄ不要〕

ﾌﾚｰﾑｽﾍﾟｰｽｻｲｽﾞ　枠線

左ﾌﾚｰﾑﾌｧｲﾙ名〔ﾌｧｲﾙ名変更時はこの記述で。以下同様〕

ﾄｯﾌﾟﾌﾚｰﾑﾌｧｲﾙ名

ﾒｲﾝﾌﾚｰﾑﾌｧｲﾙ名　

背景　ﾘﾝｸ　表示済みﾘﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸ色

<html>

<head>

<title>ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Dynamic Synchronized Frames Page2</title>

</head>

<frame>

</frameset>

</frameset>

</body>

</noframes>

</frameset>

</html>

(*2) ：　ssleft2.html　（例）　　　　　　　挿入先の　<html> ～ </html>　の、～部分にﾍﾟｰｽﾄします。

　HTMLの編集方法　

(*2)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。

〔この列ﾍﾟｰｽﾄ不要〕

背景　ﾘﾝｸ　表示済みﾘﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸ色

列項目 〔以下同様〕

<html>

<head>

<!--

TD {font-family:Arial,Verdana;text-align:center;font-weight:bold;}

-->

</style>

<title>ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Dynamic Synchronized Frames left2</title>

</head>

<body BGCOLOR="#FBF0FF" MARGINHEIGHT="0" TOPMARGIN="0" link="#5B006F" vlink="#600007"

alink="#00FFFF">

<LAYER>

<p><br>

</p>

<tr>

<br>

</td>

</tr>

==== この間､説明を省略｡ ====

</table>

</LAYER>

</body>

</html>

(*3) ：　sstop2.html　（例）　　　　　　　挿入先の　<html> ～ </html>　の、～部分にﾍﾟｰｽﾄします。

　HTMLのの編集方法　

(*3)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓の太字部分を編集し使用。

〔この列ﾍﾟｰｽﾄ不要〕

背景　ﾘﾝｸ　表示済みﾘﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸ色

ｺﾝﾃﾝﾂﾀｲﾄﾙ

行項目 〔以下同様〕

<html>

<head>

<!--

TD {font-family:Arial,Verdana;text-align:center;font-weight:bold;}

-->

</style>

<title>ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Dynamic Synchronized Frames top2</title>

</head>

<body BGCOLOR="#FBF0FF" MARGINWIDTH="0" LEFTMARGIN="0" link="#5B006F" vlink="#600007"

alink="#00FFFF">

<LAYER>

<tr>

<td bgcolor="#FFFFFF"><font size="4"><span

style="color: rgb(92,0,142)"><strong>Win/Mac関連ｿﾌﾄのﾀﾞｳﾝﾛｰﾄﾞ/ </strong>ﾒｰｶｰ<strong>

</strong>（ﾃﾞﾊﾞｲｽﾄﾞﾗｲﾊﾞｰ、BIOS、ｱｯﾌﾟﾃﾞｰﾄ）</span></font></td>

</tr>

</table>

</center></div>

<tr>

A</td>

==== この間､説明を省略｡ ====

</LAYER>

</body>

</html>

(*4) ： ssmain2.html　（例）　　　　　　　挿入先の　<html> ～ </html>　の、～部分にﾍﾟｰｽﾄします。

　*HTMLのの編集方法　

(*3)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓の太字部分を編集し使用。

〔この列ﾍﾟｰｽﾄ不要〕

背景　ﾘﾝｸ　表示済みﾘﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸ色

<body ～</body>の”～”部分のｺﾝﾃﾝﾂは任意。

URL　　ｻｲﾄ名

<html>

<head>

==== この間､説明を省略｡ ====

topFrame.scrollTo(pageXOffset,topFrame.pageYOffset);

}

//-->

</script>

<title>ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Dynamic Synchronized Frames main2</title>

</head>

<body MARGINHEIGHT="0" TOPMARGIN="0" MARGINWIDTH="0" LEFTMARGIN="0" bgcolor="#F9EEFF"

link="#5B006F" vlink="#600007" alink="#00FFFF">

<p></p>

==== この間､説明を省略｡ ====

</tr>

</table>

</body>

</html>

< 補足 >　　　　適時参照あれ！。

　・　Wordpad　によるHTMLｿｰｽ（ﾀｸﾞ）を見ながらの直接編集方法。