区分: 

　All
企業・団体名など 担当者名など 電話・ﾌｧｯｸｽ Email URL

　

　ﾎｰﾑ　へ　　　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　ﾃﾞｰﾀﾍﾞｰｽ　　　database.htm

　ﾃﾞｰﾀﾍﾞｰｽ ： ”*.CSV ﾌｧｲﾙ”　をWebで表示、文字列ｿｰﾄ（並び替え）/抽出が自在にできる。　　　DHTML。　　　　ﾃﾞｰﾀﾍﾞ-ｽの編集は、database.csv ﾌｧｲﾙを　”ﾃｷｽﾄｴﾃﾞｨﾀｰ”　や、”Excel”　で開き行います。　　　Internet Explorer4.x〜対応。　　　　　ｺﾋﾟｰ、編集して制作者の情報を反映、Webで応用可能。

　ﾃﾞﾓは、抽出ｷｰの指定を　区分：[　Movie　　　　▼　]　、”ﾏｳｽｽｸﾛｰﾙ”でなどで、またｿｰﾄｱｲﾃﾑの指定を　”企業･団体名”　などの項目ｸﾘｯｸで行います。　　 　　　　　連番付きの、担当者名、電話、Emailは架空値です。

　

　< ご使用方法 >

　　・　ﾛｰｶﾙ（=PC）への保存は、　database.htm　、database.csv を右ｸﾘｯｸ、[対象をﾌｧｲﾙに保存] - 【ﾌｧｲﾙのﾀﾞｳﾝﾛｰﾄﾞ】、【ﾌｧｲﾙ名を付けて保存】 - <保存する場所>： ……、などで。　　　　※: 【Internet Explorer】 - [ﾌｧｲﾙ] - [名前を付けて保存]−[ﾌｧｲﾙの種類] ”Webﾍﾟｰｼﾞ、完全” ……、などで変わってしまったﾌｧｲﾙ名や、*.html 中のﾊﾟｽは要修正。

　　・　このDHTMLの実装方法は、database.htm をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、ﾎｰﾑﾍﾟｰｼﾞ作成ｿﾌﾄなどのHTML挿入/編集ﾒﾆｭｰなどを使って、新しいﾍﾟｰｼﾞ 1 や hogehoge.html（=任意の挿入先ﾌｧｲﾙ名） の、 <head>　〜　　</head>　 の任意の行間に (*1) を、さらに 　<body>　〜　　</body>　 の任意の行間に (*2) をﾍﾟｰｽﾄします。

　　･　編集方法は、hogehoge.html を WordPad や SmipleText などのﾃｷｽﾄｴﾃﾞｨﾀｰ、あるいは ”FrontPage Express” などのﾎｰﾑﾍﾟｰｼﾞ制作ｿﾌﾄのHTMLﾀｸﾞ挿入/編集ﾒﾆｭｰ で開き編集します。　　　　下記の（例） (*1) と、(*2) を参考に太字部分の編集を任意に行います。 　　　　　ﾃﾞｰﾀﾍﾞ-ｽの編集〔抽出ｷｰ、ﾃﾞｰﾀ追加/削除、……〕は、ﾃｷｽﾄｴﾃﾞｨﾀｰかExcelで　database.csv  ﾌｧｲﾙを開き行います。　　　　　　　ｱｲｺﾝ画像などの変更は、hogehoge.html などの該当記述を準備した画像ﾌｧｲﾙ名に変更。　　　　　　　 ﾊﾟﾗﾒｰﾀｰの変更は該当部分で。　　　　※: ﾃｷｽﾄｴﾃﾞｨﾀｰによる編集は、HP制作ｿﾌﾄとの互換性の問題を生じません（HP制作ｿﾌﾄ間は少し生じる）。　　　　※: 太字、彩色自体は動作に無関係。

　　･　作動ﾃｽﾄは、ﾛｰｶﾙ（PC）に保存し、 Internet Explorer 4.x〜 などで開いて。　　　　更新の確認は、ie やｻｰﾊﾞｰからのｷｬｯｼｭﾃﾞｰﾀｰ更新を、　目的のﾍﾟｰｼﾞを表示し ieでＦ５ｷｰを押し最新ﾃﾞｰﾀ読み込みで行います（≠再ｱｸｾｽ）。

　　･　ｱｯﾌﾟﾛｰﾄﾞや作動ﾃｽﾄは、hogehoge.html と同じ階層〔ﾎﾙﾀﾞｰ/ﾃﾞｨﾚｸﾄﾘｰ〕に、　使用する画像、database.csv などを転送/配置し実施。　　　　※：別ﾃﾞｨﾚｸﾄﾘｰに配置時は、*.html 中のﾊﾟｽは要修正。　　　FTPなどで変わったﾌｧｲﾙ名は要修正。　　　　ｽｸﾘﾌﾟﾄ構文中への改行混入は非作動原因。

　･　関連情報 ： 色記号5、〃6、ｽﾀｲﾙｼｰﾄﾘﾌｧﾚﾝｽ、ﾎｰﾑﾍﾟｰｼﾞ開設入門。　　　Web Development、Web開発、IE10 互換性ｸｯｸﾌﾞｯｸ、〃開発者向けｶﾞｲﾄﾞ、IE API ﾘﾌｧﾚﾝｽ、IE 開発 > HTMLとCSS、開発ﾂｰﾙでｻｲﾄを修正、 ｽｸﾘﾌﾟﾄ ﾃﾞﾊﾞｯｸﾞの概要、HTMLとCSSのｻﾎﾟｰﾄ 、CSSの改良点、XML、〃ﾘﾌｧﾚﾝｽ、DHTML。

　(*1) ：　database.htm （例）　　　　　　　　　挿入先の 　<head> 〜 </head>　　の、〜　 部分にﾍﾟｰｽﾄします。

　HTMLの編集方法　  (*1) をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
　〔この列ﾍﾟｰｽﾄ不要〕

　ｼﾌﾄJIS使用（削除不可）

互換表示

　ｉｅなどに表示するｱｲｺﾝﾌｧｲﾙ名（削除可）

　お気に入り、ﾀｽｸﾊﾞｰに表示するﾍﾟｰｼﾞ名（≠ﾌｧｲﾙ名）

　

　

　

　

　

　

　

　

<style type 〜 </style>　は（削除可）

　ﾏｳｽｵｰﾊﾞｰ時のﾃｷｽﾄ　 背景色〔色記号、2〕　下線表示

　非ﾏｳｽｵｰﾊﾞｰ時の下線非表示（逆も可）

　

　

　ﾘﾝｸを ﾍﾟｰｼﾞ全体で開くを標準（削除可）

　

 　

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

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

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

　

<title>サンプルページ　　データベース</title>

　<script>

　function jump(parts){

====  この間､説明を省略｡  ====

　else

　{　//Use current sort order for new column sort

　tdcStaff.SortColumn = varColumn;　}

　tdcStaff.Reset();　}

　</script>

　<style>

　BODY { font-size: 11pt; font-family: MSPゴシック, tahoma, sans serif, helvetica; }

　TH A { color: white }

A:hover {

　COLOR: #8000e2; BACKGROUND-COLOR: #f3edee; TEXT-DECORATION: underline　}

　A {　TEXT-DECORATION: none　}

</style>

　<base target="_top">　

　(*2) ：　database.htm （例）　　　　　　　　挿入先の 　<body> 〜 </body>　の、〜 部分にﾍﾟｰｽﾄします。

　　HTMLの編集方法　  (*2)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
　〔この列ﾍﾟｰｽﾄ不要〕

　背景　ﾘﾝｸ　表示済みﾘﾝｸﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸの各色（任意値）

　

　

　

*.CSVﾌｧｲﾙ名

　

　

　

罫線

　

　

ﾒﾆｭｰｻｲｽﾞ

抽出ｷｰ

　

　

　

　

　

　

　

　

抽出ｷｰ背景　　前景色

　

　

　

　

　

　

　

　

項目背景色　項目　〃名（任意）

　以下同じ。

　

　

　

　

　

　

　

　

　

　

ﾃﾞｰﾀｰ背景色　項目

　

　

　

　

　

　

　

　

　

　

　

　

 　

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

<p><font  size="3"><!--webbot bot="HTMLMarkup" startspan --><p>

　<font  size="3">

　<object ID="tdcStaff" CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83" width="192"

　height="192">

　<param name="DataURL" value="database.csv">

　<param name="UseHeader" value="True">

　<param name="TextQualifier" value=",">

　</object>

　</font></p>

　<table CELLPADDING="0" CELLSPACING="0" BORDER="1" bordercolor="#776061">

　<tr>

　<td><font  size="3"><b>&nbsp;区分:</b>&nbsp; <select

　NAME="cboDept" STYLE="WIDTH=150" ONCHANGE="selectChange();" size="1">

　<option>All </option>

　<option>Shop </option>

　<option>Support </option>

　<option>Technical </option>

　<option>Music </option>

　<option>Movie </option>

　<option>Travel </option>

　</select></font></td>

　</tr>

　<tr BGCOLOR="#FFC800">

　<td><div ID="divDept"><font COLOR="#444444"><b><p><font

　size="3">&nbsp; All</font></b></font></p>

　</div></td>

　</tr>

　<tr>

　<td><table DATASRC="#tdcStaff">

　<THEAD>

　<tr>

　<th BGCOLOR="#CFCEDE"><a

　HREF="Javascript: colSort(&quot;Kigyou&quot;);">企業・団体名など</a></font></th>

　<th BGCOLOR="#CFCEDE"><a

　HREF="Javascript: colSort(&quot;Name&quot;);">担当者名など</a></font></th>

　<th BGCOLOR="#CFCEDE"><a

　HREF="Javascript: colSort(&quot;Telephone&quot;);">電話・ﾌｧｯｸｽ</a></font></th>

　<th BGCOLOR="#CFCEDE"><a

　HREF="Javascript: colSort(&quot;Email&quot;);">Email</a></font></th>

　<th BGCOLOR="#CFCEDE"><a

　HREF="Javascript: colSort(&quot;url&quot;);">URL</a></font></th>

　</tr>

　</THEAD>

　<TBODY>

　<tr>

　<td BGCOLOR="#F5F4F2"><div datafld="Kigyou"></div></td>

　<td BGCOLOR="#FFFFFF"><div datafld="Name"></div></td>

　<td BGCOLOR="#F5F4F2"><div datafld="Telephone"></div></td>

　<td BGCOLOR="#FFFFFF"><font face="MS UI Gothic" size="3"><a DATAFLD="Email"

　STYLE="Text-Decoration:underline"

　ONMOUSEOVER="if(this.href.indexOf(&quot;mailto:&quot;) == -1){ this.href = &quot;mailto:&quot; + this.href};">

　<span datafld="Email"></span></a></font></td>

　<td BGCOLOR="#F5F4F2"><font face="MS UI Gothic" size="3"><a DATAFLD="url"

　STYLE="Text-Decoration:underline"

　ONMOUSEOVER="if(this.href.indexOf(&quot;x&quot;) == -1){ this.href =this.href};"><span

　datafld="url"></span></a></font></td>

　</tr>

　</TBODY>

　<TFOOT>

　</TFOOT>

　</table>

　</td>

　</tr>

　</table>

　<p><font  size="3">　</font></p>

　<!--webbot bot="HTMLMarkup" endspan --></font></p>

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

　　・　Wordpad　によるHTMLｿｰｽ（ﾀｸﾞ）を見ながらの直接編集方法。