1. 太陽風 0           ホームページ 最速!、最新!、リンクお薦め …*    太陽風 0 
  2. 太陽風 2+          (ミラーサイト)   太陽風 2+ 
  3. トップナビバー 15i        DHTML、MSのWebのプルダウンメニュー風 、3D、フェード効果、横長、3D + - アイコンのカスタマイズ。 all
  4. トップナビバー 15ia      DHTML、MSのWebのプルダウンメニュー風 、3D、フェード効果、、定位横長、3D + - アイコン任意。 all
  5. トップナビバー 15iv      DHTML、MStのWebのプルダウンメニュー風 、3D、フェード効果、縦長、3D + - アイコンのカスタマイズ。 all
  6. トップナビバー 15iva     DHTML、MStのWebのプルダウンメニュー風 、3D、フェード効果、定位、縦長、3D + - アイコン任意。 all
  7. トップナビバー 16       DHTML、MicrosoftのWebのプルダウンメニュー風。 all
  8. トップナビバー 16v       DHTML、MicrosoftのWebのプルダウンメニュー風。 縦長 - 横展開タイプ  all
  9. トップナビバー 17        DHTML、MicrosoftのWebのプルダウンメニュー風。  all
  10. トップナビバー 17a      DHTML、MicrosoftのWebのプルダウンメニュー風。  テキストサイズを固定。  all
  11. トップナビバー 17a1      DHTML、MicrosoftのWebのプルダウンメニュー風。  テキスト、表サイズを固定。  all
  12. トップナビバー 17b      DHTML、MicrosoftのWebのプルダウンメニュー風。  画像のクリックでメニュー展開。  all
  13. トップナビバー 18h      DHTML、CSS、スクロールで流されぬ、最初の行に定位、プルダウン・トップナビバー。 all
  14. トップナビバー 18hフレーム   DHTML、CSS、プルダウン・1行トップナビバー + 上下フレーム。 all
  15. トップナビバー 18v       DHTML、CSS、縦展開マウスオーバーメニュー。 all 
  16. トップナビバー 18vフレーム   DHTML、CSS、プルダウン・1行トップナビバー + 左右フレーム。 all
  17. トップナビバー 19       DHTML、MicrosoftのWebのプルダウンメニュー風。   IE4.x〜/N6.x
  18. トップナビバー 20        DHTML、MicrosoftのWebのプルダウンメニュー風。 横長 - 縦展開タイプ all
  19. トップナビバー 20v        DHTML、MicrosoftのWebのプルダウンメニュー風。 縦長 -横展開タイプ all
  20. 常駐コンテンツ 9           DHTML、トップ行に定位する、トップナビバー。  メニュー幅=Win%サイズ。   all
  21. 常駐コンテンツ 9a          DHTML、トップ行に定位する、トップナビバー。  メニュー幅=固定ピクセル値。   all
  22. 常駐コンテンツ 9a フレーム    DHTML、トップ行に定位する、トップナビバー + 上下フレーム。 メニュー幅=固定ピクセル値。 all
  23. 常駐コンテンツ 12            DHTML、スクロールを無視、最上行に定位するプルダウンメニュー。  all  
  24. 常駐コンテンツ 13        DHTML、スクロールを無視、左上に定位するリンクテーブル。  all

 

 

ホーム へ       サンプルページ   off site link  off_site.htm

ドメインのページを、”新しいWindow”で開き、同ドメインのページを同じフレームで開きます。      DHTML。      などのカスタマイズはテキストエディターなどで可。    all 対応。     コピー、編集し、簡単にWebで応用できまっ。

デモは、下のリンクのクリックで、(別ドメインページ)が新しいWindowで、細字サイト(同ドメインページ)が 、ページ全体で開くで。

 

< ご使用方法 >

・ ローカル(=PC)への保存は、off_site.htm を右クリック、[対象をファイルに保存] - 【ファイルのダウンロード】、【ファイル名を付けて保存】 - <保存する場所>: ……、などで。    ※: 【Internet Explorer】 - [ファイル] - [名前を付けて保存]−[ファイルの種類] ”Webページ、完全” ……、などで変わってしまったファイル名や、*.html 中のパスは要修正。

 ・ このDHTMLの実装方法は、off_site.htm をテキストエディターで開き、ホームページ作成ソフトなどのHTML挿入/編集メニューなどを使って、新しいページ 1 や hogehoge.html(=任意の挿入先ファイル名) の、 <head> 〜 </head> の任意の行間に (*1)を、さらに <body> 〜 </body>の任意の行間に (*2) をペーストします。

 ・ 編集方法は、hogehoge.html を WordPad や SmipleTextなどのテキストエディター、あるいは ”FrontPage Express” などのホームページ制作ソフトのHTMLタグ挿入/編集メニュー で開き編集します。    下記の(例) (*1) と、(*2) を参考に太字部分の編集を任意に行います。   ※: テキストエディターによる編集は、HP制作ソフトとの互換性の問題を生じません(HP制作ソフト間は少し生じる)。

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

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

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

 

(*1) :off_site.htm (例)         挿入先の  <head> 〜 </head> の、 部分にペーストします。

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

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

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

<style type= </style>は(削除可)
(*1)〜(*3)表タイトル背景

body 文字色 背景色 下線
ハイパーリンク 〃
表示済みの〃
マウスオーバー時の〃
クリック中の〃
フォント

 

リンクを新しいWinで開くを標準(削除可)※:target= いろいろ
同じフレーム=_self、ページ全体=_top、親フレーム=_parent
お気に入り、タスクバーに表示するページ名(≠ファイル名)

 

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

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

<style type="text/css"><!--
.xxx0 { background: #F9F8F9 url('wttec.gif'); }
.xxx1 { background-color:#E3E0DC; }
.xxx2 { background-color:#FFFFFF; }
body { color:#000000; background: #F9F8F9 url('wttec.gif'); text-decoration:none; }
a:link { color:#3C0055; background-color:#FBFAFE; text-decoration:none; }
a:visited { color:#270037; background-color:#EDECEF; text-decoration:none; }
a:hover { color:#1F002E; background-color:#D2F3F4; text-decoration:underline; }
a:active { color:#1F002E; background-color:#F5FFD2; text-decoration:underline; }
font {
font-size:12px;
line-height:13px;
}
body,tr,td,form{ font-family:MS PGothic,MS Gothic,Verdana; font-size: 12px}
 --></style>

<base target="_blank">

<title>サンプルページ  off site link</title>

 

(*2) off_site.htm (例)        挿入先の  <body> 〜 </body> の、 部分にペーストします。

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

背景 リンク 表示済みリンクンク アクティブリンクの各色(任意値)

 

 

 

 

同じドメインのリンクサンプル(任意値 、省略可) 以下、同様。 本(例)のようにリストに限定せず、説明中(例)などの一般的なリンク可。

 

 

別ドメインのリンクサンプル

 

 

 

 

 

 

 

 

 

 

同じドメインの設定(複数)

 

別ドメインページを自動で新しいWinで開く

 

 

<body bgcolor="#F8F5F5" link="#54006C" vlink="#62000D" alink="#00FFFF">

<ol>

<li style="margin-left: -19px; margin-top: 0px"><a href="index2.html" style="text-decoration: none">太陽風 0</a>  <b>ホームページ </b>最速!、最新!、リンクお薦め …*  

<a href="index2.html">index2.html</a> </font></li>

<li style="margin-left: -19px; margin-top: 0px"><a href="index2.html" style="text-decoration: none">太陽風 2+</a>(ミラーサイト)   <a href=""></a> </font></li>

<li style="margin-left: -19px; margin-top: 0px"><a href="top_navbar15i.htm" style="text-decoration: none">トップナビバー 15i</a>  DHTML、MSのWebのプルダウンメニュー風 、3D、フェード効果、横長、3D + - アイコンのカスタマイズ。 all</font></li>

====  この間、説明を省略。  ====

<li style="margin-left: -19px; margin-top: 0px"><a href="http://www.pat.hi-ho.ne.jp/oka_tosho/top_navbar16v.htm" >トップナビバー 16v</a>       DHTML、MicrosoftのWebのプルダウンメニュー風。 縦長 - 横展開タイプ  all</font></li>

====  この間、説明を省略。  ====

<li style="margin-left: -19px; margin-top: 0px"><a href="always_ontop13.htm" style="text-decoration: none">常駐コンテンツ 13</a> </font>

     DHTML、スクロールを無視、左上に定位するリンクテーブル。  all</font></li></font>

</ol>

 

<!-- ★ ---------- ↓ この間をコピー、編集、ペーストします。 ---------- -->

<script language="JavaScript1.2">

<!--

//Open offsite links in new window option- By Jessica Hammer

====  この間、説明を省略。  ====var excludedomains=["www001.upp.so-net.ne.jp", "www02.so-net.ne.jp"]

//2)Automatically open offsite links in new window? (1=yes, 0 will render a checkbox for manual selection)

var auto=1

var excludedomains=excludedomains.join("|")

====  この間、説明を省略。  ====}

if (auto)

window.onload=dynamiclink

// -->

</script>

<!-- ★ ---------- ↑ この間をコピー、編集、ペーストします。 ---------- -->

 

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

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