ホームへ       サンプルページ  コーナーロゴ   corner_logo.htm

左上に、ロゴ/イメージなどを20秒間表示。        Winサイズの変更や、スクロールに依存せず定位置 保持。        all対応です。     ロゴ/イメージや、マウスオーバー時のコメント〔代替え表示〕、ハイパーリンク、表示時間はJavaScriptの記述で簡単に変更できます。   

 

 <ご使用方法>

  ・ ローカル(=PC)への保存は、 corner_logo.htmstaticlogo.jsstaticlogo2.jsstaticlogo3.jsstaticlogo4.js、 を右クリックします。   [対象をファイルに保存] - 【ファイルのダウンロード】、【ファイル名を付けて保存】 - <保存する場所>: (C:¥tempや、C:\My Documents\hp¥sample1など任意)、<ファイル名>: *.htm など(ここでは変更不要) [保存]ボタンを押す、などで行います。   FTP後にファイル名が変わっちまったときは、修正します。   PCに保存したファイルを、”WordPad”や、シンプルテキスト あるいは ”FrontPage Express” などで開き編集して使用します。   このサンプルは、コピーして少しの編集(タイプイン、カット、コピー、ペースト、……)で、すぐ使用することが可能です。   <ご使用方法>などの、不要な文字は削除します。

  ・ このDHTMLの実装方法は、corner_logo.htm を WordPad やシンプルテキスト などのテキストエディターで開き、(*1) 部分をコピーします。   任意のHTMLファイル hogehoge.html(制作者が名付けた挿入先ファイル)に、テキストエディターあるいは、HTML挿入メニューを使って、  <body> 〜 </body>の、”〜”部分に、(*1) 部分をペーストします。

  ・ 編集方法 : 下記の(例)(*1) 、(*2)  の太字部分を参考にします。   パラメーターの変更も該当部分の記述/追加/変更/削除で行います。    説明のための太字、彩色自体に依存なし。

  ・ ロゴ/イメージの表示位置の変更は、(*1) の太字部分の記述で行い、該当の staticlogo3.js などを下記要領で配置します。   本サンプルは、”左上”です。

  ・ ロゴ/イメージやハイパーリンク、マウスオーバーで表示するメッセージ、ロゴ/イメージ表示時間などの指定は、staticlogo3.js などをテキストエディターで開き、 (*2)太字部分の記述で行います。

  ・ アップロードは、hogehoge.html〔DHTMLを実装したファイル〕と同じ階層〔ディレクトリ/ホルダー〕に、staticlogo.jsstaticlogo2.jsstaticlogo3.jsstaticlogo4.js のいずれかあるいは全てと、使用するイメージ :1-20al2.jpg などを配置します。    ローカル〔=PC〕での作動試験も同様に、同じ階層〔ディレクトリ/ホルダー〕これらを配して行います。   更新後は、必ずブラウザーでの再読込み〔IE:F5キー、NN:Ctrl+Rキーで〕が必要です。

 ・ 関連情報 : 色記号62スタイルシートリファレンスホームページ開設入門が便利!。   Web DevelopmentWeb開発CSS Compatibility in ie7CSS Enhancements in ie6XMLDHTMLColorTableHTMLの色指定HTMLリファレンス

 

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

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

 右下: staticlogo.js
左下: staticlogo2.js
左上: staticlogo3.js
右上: staticlogo4.js

<body>

 <script src="staticlogo3.js">

 </script>

 </body>

 

(*2)  : staticlogo3.js (例) DHTMLの実装ファイル〔hogehoge.html〕と同じ階層〔ディレクトリ/ホルダー〕に配置します。

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

 

  

  

  

  

 ロゴ/イメージファイル名

  

 ハイパーリンク

  

 マウスオーバーで表示するメッセージ

  

  

  

  

 ロゴ/イメージ表示時間
〔12:20秒、24:40秒〕

  

 〔以下省略〕   →  ↓

  

 //edit the below 6 steps

 // 1) substitute 112 and 73 with the width and height of your logo image, respectively

 if (document.images)

 var staticlogo=new Image(112,73)

 // 2) change the image path to reflect the path of your logo image

 staticlogo.src="1-20al2.jpg"

 // 3) Change url below to the target URL of the logo

 var logolink=" index_map.html"

 // 4) change the alttext variable to reflect the text used for the "alt" attribute of the image tag

 var alttext="=(^。^)= こんにちわ …*、Hello!"

 // 5) set below to either "1" or "0" ("1" fades the logo into view) Note: IE 4 specific

 var fadeintoview=1

 /* 6) Finally, below variable determines the duration the logo should be visible after loading, in seconds. If you'd like the logo to appear for 20 seconds, for example, enter 20. Entering a value of 0 causes the logo to be perpectually visible.

 */

 var visibleduration=12

  

 ///////////////////////////Do not edit below this line/////////////////////////