ホーム へ サンプルページ トップナビバー 39vma top_navbar39vma.htm(作成手順・初期右フレームページ)
トップナビバー + 上左右フレーム、ターゲットは右ページ、フレーム越え展開メニュー、メニュー構成容易。 DHTML、CSS。 ハイパーリンク、アイコン、メニュー構造・構成などのカスタマイズはテキストエディターなどで可。 all 対応。 コピー、編集し、簡単にWebで応用できまっ、(^ ^)。 関連・詳細情報 : top_navbar39hfr.htm(トップナビバー + 上下フレーム)
デモ : 一部はInternet Explorerモード で作動。 ⇒ 設定方法 でお試しあれ!。 sample6b_fr.htm(Hello!……のページへようこそ …* 6b)のクリックで。 復旧は、”戻る”アイコンのクリックで。 ※: メニュー展開不調時は、[F5]キー などでの再読込で。
< ご使用方法 >
・ 保存は top_nav39/ をクリック開いたホルダーで、top_navbar39vl.htm(左ページ・Script実装) や、top_navbar39vma.htm(この右ページ・Script実装)、sample6b_fr.htm(上左下フレーム・Script実装)、sample1c1_index.htm(上ページ)、*.js、*.gif などのファイル♪ を右クリック、【名前を付けてリンクを保存】 - <保存する場所>: ……、などで。 ※: 変わってしまった、ファイル名や、*.htm 中のパスは要修正。
・ ペーストは、top_navbar39vfr.htm をテキストエディターで開き、ホームページ作成ソフトなどの ”テキストモード で、新しいページや hogehoge.htm(=任意の挿入先ファイル名) の、 <html> 〜</html>に (*1) をペーストします。 ※: テキストモード : コード/HTMLタグ挿入/HTMLメニュー など。
・ 編集 : 初期に表示させる右ページは、【初期・デフォルトでフレームに表示するページ】を参考に、top_navbar39vfr.htm(左右フレーム)中の記述を、src="top_navbar39vma.htm"(例)から任意のファイル名 に変更します。 左ページ、src="top_navbar39vl.htm"、上ページsrc="../top_navbar41/sample1c1_index.htm" も同様に。 ※: スクロールバーの表示を自動(auto)に指定時は、初期非表示になります。
・ このDHTML(トップナビバー)の実装方法は、(*2)を参考に top_navbar39vl.htm (左ページ・Script実装) と、top_navbar39vma.htm (右ページ・Script実装)をテキストエディターで 編集。 メニュー構成・ハイパーリンクは、(*3) を参考に contentv.js を、背景画像・アイコン画像・フォントは、LRL.css の編集で。
・ アップロードは、hogehoge.htm と同じホルダーに、使用してる 上記画像、*.js、*.css などがあればアップロードします。 別ホルダーの場合は、hogehoge.htm の該当パス注意。
・ 作動テストは Edge〜 などで。 更新の確認は、ブラウザーなどのキャッシュのクリア後に実施。 (1) [F5]キ- or Ctrl+Rキー を押し、最新データ読み込みで。 更に、(2) Edgeを全て閉じ、再起動を行い、【Edge】 - 右上 [……] - [設定] - [プライバシー、検索、サービス] - [閲覧デ-タをクリア] - [クリア-するデ-タの選択] - [v]閲覧の履歴 -[今すくクリア] をクリック。 留めに、(3) サーバーのファイルを一旦削除。
・ 関連情報 :
色記号 、RGB5 〃6 、〃8 、フォント、スタイルシートリファレンス、ホームページ開設入門、HTMLをテキストエギタ-で編集。
(*1) : sample6b_fr.htm(例) 挿入先の hogehoge.html(フレームページ) にペーストします。
HTMLの編集方法 | (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。 |
〔この列ペースト不要〕
シフトJIS使用(削除不可) ieなどに表示するアイコンファイル名(削除可) お気に入り、タスクバーに表示するページ名(≠ファイル名)
上ページ
左ページ
説明文、削除可 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=x-sjis"> <link REL="SHORTCUT ICON" href="favicon.ico"> <title>Hello!……のページへようこそ …* 6b</title>
<!-- ☆ ----------- ↓ この間をコピー&ペーストします。 ------------ --> <frameset rows="78,*" framespacing="1" border="0"
frameborder="0"> |
(*2) : top_navbar39vl.htm(例) 挿入先の hogehoge.html( 左ページ) にペーストします。
HTMLの編集方法 | (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。 |
〔この列ペースト不要〕
シフトJIS使用(削除不可) ieなどに表示するアイコンファイル名(削除可) <style type 〜</style>は(削除可)
リンクを新しいWinで開くを標準(削除可)※:target= いろいろ
※:<body> 部の編集 |
<meta http-equiv="Content-Type" content="text/html; charset=x-sjis"> <link REL="SHORTCUT ICON" href="favicon.ico"> <style type="text/css"><!--
<base target="_blank"> <!-- ☆ ----------- ↓ この間をコピー&ペーストします。
------------ --> |
(*2) : top_navbar39vma.htm(例) 挿入先の hogehoge.html( 右ページ) にペーストします。
HTMLの編集方法 | (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。 |
〔この列ペースト不要〕
シフトJIS使用(削除不可) ieなどに表示するアイコンファイル名(削除可) <style type 〜</style>は(削除可)
リンクを新しいWinで開くを標準(削除可)※:target= いろいろ
|
<meta http-equiv="Content-Type" content="text/html; charset=x-sjis"> <link REL="SHORTCUT ICON" href="favicon.ico"> <style type="text/css"><!--
<base target="_blank"> <!-- ☆ ----------- ↓ この間をコピー&ペーストします。
------------ --> ==== こ以降は、各々のコンテンツを記述。 ==== </body> |
(*3) : contentv.js (例) テキストエディターで開き、編集しhogehoge.htmlと同ディレクトリーに転送・配置します。
*.js の編集方法 | (*3)をテキストエディターで開き、下記↓の太字部分を編集し使用。 |
〔この列ペースト不要〕
メニュー・サイト名 URL 以下、同様。 |
addMenu("Demo", "demo-top"); ==== この間、説明を省略。 ====
addLink("aaa-sub", "画像8", "",
"../top_nav39/top_navbar39vma8.htm", ""); |
(*3) : LRL.css(例) テキストエディターで開き、編集しhogehoge.htmlと同ディレクトリーに転送・配置します。
*.css の編集方法 | (*3)をテキストエディターで開き、下記↓の太字部分を編集し使用。 |
〔この列ペースト不要〕
メニューバー マウスオフ時
|
.itemOff { width:115px; padding:1px 6px 1px 11px; border:1px solid
#C5B9D1; text-align:left; background: #D4D0C8
url('../tab_menu12/bg_gry3.gif'); } |