ホームへ(ページ全体、新しいWin、左、上、下) topへ(左、上、下) デモは左のリンクのクリックで!。
<説明>
(1) このサンプルは、レフトフレームと、ナビゲーションヘッダー、メインフレーム、フレームページからなるネストフレームページが作成済み。 このメインフレームフレーム(newpage5.htm)にメインコンテンツを作成します。 左フレームのハイパーリンクで上フレームが変わり、さらに上フレームのハイパーリンクで下フレームが変わります。
(2) ローカル(=PC)への保存は、” frame2.htm”、” newpage3.htm”、”newpage4.htm”、”newpage5.htm”
をそれぞれ右クリックします。 [対象をファイルに保存] -
【ファイルのダウンロード】、【ファイル名を付けて保存】 -
<保存する場所>: ……、などで行います。 *.html
などに拡張子が変わたら修正します。 frame2.htm のクリックで開けます。
(3) 編集は、ローカル(=PC)にの保存した *.htm を”FrontPage Express”で個別に開き、コンテンツのインデックスタイトルや、コンテンツの追加、削除など編集を行います。 HTMLの直接編集を、Wordpad
や シンプルテキスト などのテキストエディターや、HTMLタグ編集メニューで行っても同じです。 フレームの極細境界は、上下できます。 極細境界幅の変更は、Wordpadで
frame2.htm を開き、 <frameset framespacing="1"
frameborder="0"
border="false" cols="165,*"> 部分の 1 を2〜5に変更しテキストモードで保存します。 ナビゲーションヘッダーフレーム幅の変更は、<frameset rows="15%,*"> の
15 を変更します。 レフトフレーム幅の変更は
165
を変更します。 <説明>と、使用しないブックマーク top〜end 、ハイパーリンクなどは削除します。 frame2.htm
は編集しなくてもかまいません。 frame2.htm
と、 newpage3〜5.htm と画像などをWebサーバーにアップロードします。
(4) 左フレームのリンク ”上、下ページを同時切替” で、上、下、左フレームのページを同時に切り替える(例) Wordpadなどのテキストエディターで実装先の、<head> 部分に (*1) を、<body>部分に (*2) を記述し、太字部分をめいめいの値に編集します。 左フレームなどの解除は、left と http://www.lycos.co.jp/ 部分の削除などで。 スクリプト中の改行混入は不作動原因!。
(*1) : 実装先〔newpage3.htmなど〕の、 <head> 部分に記述
HTMLの編集方法 | (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、編集し使用。 |
〔この列ペースト不要〕
各人が付けたframe nameを記述。 frame name="rtop" frame name="rbottom" frame name="left"
|
<SCRIPT><!-- function jump(url1, url2) { window.parent.rtop.location.href = url1; window.parent.rbottom.location.href = url2; window.parent.left.location.href = url2; return false; } // --></SCRIPT> |
(*2) : 実装先〔newpage3.htmなど〕の、 <body> 部分に記述
HTMLの編集方法 | (*2) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、編集し使用。 |
〔この列ペースト不要〕 上、下、左フレームに表示するURL 同様の記述でURL、リンク名を追加できます。 |
<A HREF="#" onClick="return jump('index2.html', ' sy002.htm', 'http://www.lycos.co.jp/')">上、下、左ページを同時切替</A>
|
1 ここにコンテンツのインデックスタイトルを記入します。
ここにコンテンツ(内容)を挿入します。
ここに……。
……。
……
……
……
……
……
……
……
……
……
……
……
……
……
……
……
……
……