ホーム へ       サンプルページ  次頁フレーム(説明)  next_frs.htm

[前/次ページへ] ボタンで、下フレームに表示のページを巡に切り替える。  ライブラリーなど、シリーズものコンテンツに便利!。  DHTML。      表示ページやフレームサイズ、ボタン配色などのカスタマイズはテキストエディターなどで可。    all 対応。     コピー、編集し、簡単にWebで応用できまっ、(^ ^)。

デモは、next_fr.htm(次頁フレーム) を開き、[次ページへ]ボタンなどのクリックで。

 

 

 

 ご使用方法 >

 ・ ローカル(=PC)への保存は、next_frs.htm(説明書)、next_fr.htm(次頁フレーム)、next_fr_tp.htm(上ページ・JavaScript実装)、next_fr_mn1.htm(初期下ページ例・以下任意)、next_fr_mn2.htm(下ページ例)、<next_fr_mn3.htm(下ページ例)、next_fr_mn4.htm(下ページ例)、next_fr_mn5.htm(下ページ例)、setumeisyo.htm(総合ページ)、r_arrow.gif(矢画像ファイル・任意)、r_arrowl.gif<(矢画像ファイル) を右クリック、[対象をファイルに保存] - 【ファイルのダウンロード】、【ファイル名を付けて保存】 - <保存する場所>: ……、などで。    ※: 【Internet Explorer】 - [ファイル] - [名前を付けて保存]−[ファイルの種類] ”Webページ、完全” ……、などで変わってしまったファイル名や、*.html 中のパスは要修正。

 ・ このフレームの制作方法は、next_fr.htm をテキストエディターで開き、ホームページ作成ソフトなどのHTML挿入/編集メニューなどを使って、新しいページ 1 や hogehoge.html(=任意の挿入先ファイル名) の、 <html> 〜< </html> (*1) をペーストし、フレームサイズなどを、 WordPad や SmipleText などのテキストエディター、あるいは ”FrontPage Express” などのホームページ制作ソフトのHTMLタグ挿入/編集メニュー で開き編集します。   ※: テキストエディターによる編集は、HP制作ソフトとの互換性の問題を生じません(HP制作ソフト間は少し生じる)。    ※: 太字、彩色自体は動作に無関係。

 ・ このJavaScript(次頁フレーム)の実装方法は、next_fr_tp.htm(上ページ・JavaScript実装)を参照。    ホームへ …、以下の説明部分は削除して使用。

 ・ 初期に表示させる下ページは、【初期・デフォルトでフレームに表示するページ】を参考に、next_fr.htm(次頁フレーム)中の記述を、src="next_fr_mn1.htm"(例)から任意のファイル名 に変更します。   上ページ、src="next_fr_tp.htm"も同様に。

 ・ 作動テストは、ローカル(PC)に保存し、 Internet Explorer 4.x〜 などで開いて。    更新の確認は、ie、Netscapeやサーバーからのキャッシュデーター更新を、目的のページを表示し ieで [F5]キー を押し最新データ読み込みで行います(≠再アクセス)。   Netscapeは、Ctrl+Rキーで。

 ・ アップロードや作動テストは、hogehoge.html と同じ階層〔ホルダー/ディレクトリー〕に、使用する画像なども転送/配置し実施。  ※:別ディレクトリーに配置時は、*.html 中のパスは要修正。   FTPなどで変わったファイル名は要修正。    スクリプト構文中への改行混入は非作動原因。

 ・ 関連情報 :色記号5〃6スタイルシートリファレンスホームページ開設入門が便利!。   Web DevelopmentWeb開発MSDN IE8 HTMLとCSS開発ツールでサイトを修正スクリプト デバッグの概要HTMLとCSSのサポートCSSの改良点IE7IE6XMLDHTML

 

 

(*1) next_fr.htm (例)         テキストエディターで開き、編集、使用します。  

   HTMLの編集方法   (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。
  〔この列ペースト不要〕

シフトJIS使用(削除不可)

 

ieなどに表示するアイコンファイル名(削除可)

 

フレームネームの宣言:target=に記述し使用。

<ターゲット
frame name:main など
新しいWin : _blank
同じフレーム : _self
ページ全体 : _top
親フレーム : _parent

 

<head>

<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">

<title>サンプルページ 次頁フレーム</title>

<link REL="SHORTCUT ICON" href="favicon.ico">

</head>

<frameset  rows="35,* " framespacing="1" border="0" frameborder="0">

<frame name="ue" src="next_fr_tp.htm<" target="naka" scrolling="no">

<frame name="naka" src="next_fr_mn1.htm<" target="_self" scrolling="auto">

<noframes>

<body>

<p>ここに、サイト=ページの紹介文などを記述します。 検索エンジンの、”サマリー”に表示されたりします。 検索キーワードも抽出されます。</p>

</body>

</noframes>

</frameset>

<!--  ここから、説明文。 カスタマイズ・編集は、それぞれ下記に該当部分で。

<【タイトル】

<title>xxxxxxのページ</title>   ※:タスクバーや、タイトルバー、お気に入りなどに表示される文字列。 

【枠線】 

<frameborder="0">      ※:1=枠幅 

<framespacing="1">      ※:0 =境界線を掴めなくなります。

【スクロールバー】

<scrolling="auto">     ※:auto=スクロールバー自動表示 no =  〃  非表示(メニューのフレームなどに使用) 

【フレームサイズ】

<vframeset rows="35,*">  ← Winを横2行に分割。 上フレームの高さ=80pixels固定、下フレームサイズ=*は自動変化。

<rows="35,*">     フレーム行高さ、ピクセル(Winサイズ変化に非変化、解像度で変化)

<rows="30%,*">    フレーム行高さ、Winサイズ比(Winサイズ変化で変化)

<cols="170,*">    フレーム列幅、ピクセル(Winサイズ変化に非変化、解像度で変化)  

<cols="30%,*">    フレーム列幅、Winサイズ比(Winサイズ変化で変化)

<vscrolling="auto" noresize>  固定は、noresize を追加。

<【表示先】

<target="naka">       ※:<frame name="naka" メイン(下)フレームに表示する。

<target="_self">        ※:<frame name="naka"  同じ(下)フレームに表示する。

【初期・デフォルトでフレームに表示するページ】

<src="xxx.htm">        ※:同じ階層に配置したファイル名や、別階層、ドメインに配置したURL+ファイル名。

ここまで、説明文。  --> 

 

 補足    適時参照あれ!。

 ・ Wordpad によるHTMLソース(タグ)を見ながらの直接編集方法。

 ・ ”FrontPage Express” でのHTMLタグの編集方法は、コピー元の範囲を左クリックした状態でマウスカーソルでなぞり範囲指定し、反転表示に変えます。  Ctrl+Cキーを押します〔あるいは右クリック → コピー〕。  FrontPage Express で挿入先のファイルを開き、 [表示] - [HTML]を選択、【HTMLの表示と編集】、 <body> 〜 </body>の間の任意の行、 ”挿入場所=” にカーソルを置き、Ctrl+Vキーを押します。〔あるいは、右クリック → 貼り付け〕でのペーストや、HTMLのタイプインを行い、 [OK] で完了!。 Internet Explorer5.x〜

 ・ ”FrontPage Express” での個別のHTMLタグの挿入方法は、 [挿入] - [HTMLマークアップ]メニューで、HTMLのペースト・編集、 [OK] で完了!。  この場合、[?] などのマークが作成されます。  この[?]マークを任意のHTMLファイル(Webページ)の、任意の位置にペースト(貼り付け)できます。    編集は次の方法で行います。  [?]を右クリックし、[HTMLマークアップのプロパティ]をクリックし、【HTMLマークアップ】を開いて行います。  この[?]を Wordpad にコピーして、広い画面で編集後、再び【HTMLマークアップ】に戻しても同じ。

 ・ ”FrontPage Express”の起動は、【スタート】- [ファイル名を指定して実行] - 名前: Fpxpress (半角)を入力、Enterキーを押すなどで。

  ”IBMホームページビルダーでの個別のHTMLタグ゙の挿入方法は、挿入位置をポイントします。  [挿入]メニュー - [その他] - [HTMLタグ]を選択し、HTMLの記述を行い - [OK]にて終了します。  編集はこのコンテンツ部を右クリック、[属性変更]などで行います。  テキストエディターでコピー/カット/編集したテキスト=HTMLドキュメントをこの方法で挿入できます。      全体のHTMLタグ゙の挿入方法は、最上・下段の[HTMLソース]タブをクリックします。 HTMLの編集(追加/ペースト/変更/削除/カット/移動)を行います。  ローカル(PC)に保存し、[プレビュー]タブをクリックし、モニーターで確認します。    これらのHTMLの挿入方法はアクセスカウンターや、Java AppletJava ScriptDHTMLなどの追加/記述 にも重宝します。