サンプルページ　　Hello！…… のページへようこそ …* 12if1a

ﾎｰﾑへ　…、以下の説明部分は削除して使用。

ﾎｰﾑへ　　　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Hello！……のﾍﾟｰｼﾞへようこそ …* 12if1a　　tab_menu12if1a.htm （IFRAME - 短冊）

ﾀﾌﾞﾒﾆｭｰ、”ﾏｳｽｵﾝ/ｵﾌ”画像(文字入れ自在)使用、短冊 + IFRAME、ｽﾗｲﾄﾞｼｮｰ、WindowsMediaPlayer、ﾏｳｽｵｰﾊﾞｰ展開ﾒﾆｭｰ。　　　　　　DHTML。　　　　　　ﾀﾌﾞ画像、ﾀﾌﾞ文字、〃配色、ﾒﾆｭｰｺﾝﾃﾝﾂ、ﾊｲﾊﾟｰﾘﾝｸなどのｶｽﾀﾏｲｽﾞはﾃｷｽﾄｴﾃﾞｨﾀｰなどで可。　　　　all 対応。　　　　　ｺﾋﾟｰ、編集し、簡単にWebで応用できまっ、(^ ^)。　　

< ご使用方法 >

　・　ﾛｰｶﾙ（=PC）への保存は、/tab_menu12 を開き、それぞれのﾌｧｲﾙ、tab_menu12if1a.htm、220200b.js（ｽﾗｲﾄﾞｼｮｰ）、58761550.css（ﾏｳｽｵｰﾊﾞｰ展開ﾒﾆｭｰ）、58761550.js（〃）、画像（例）:tbwhb.gif、tbskb.gif などを右ｸﾘｯｸ、[対象をﾌｧｲﾙに保存] - 【ﾌｧｲﾙのﾀﾞｳﾝﾛｰﾄﾞ】、【ﾌｧｲﾙ名を付けて保存】 - <保存する場所>： ……、などで。　　　※: 変わってしまったﾌｧｲﾙ名や、*.html 中のﾊﾟｽは要修正。　　　

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

　･　編集方法は、hogehoge.html をﾃｷｽﾄｴﾃﾞｨﾀｰ、あるいは ”FrontPage Express” などのﾎｰﾑﾍﾟｰｼﾞ制作ｿﾌﾄのHTMLﾀｸﾞ挿入/編集ﾒﾆｭｰで開き編集します。　　　　下記の（例） (*1) と、(*2) を参考に太字部分の編集を任意に行います。　　　ｽﾗｲﾄﾞｼｮｰに表示画像は、220200b.js、詳細は、ｽﾗｲﾄﾞｼｮｰ 14 で。　　　　　ﾏｳｽｵｰﾊﾞｰ展開ﾒﾆｭｰの詳細は、top_navbar55.htm で。　　　　　※: ﾃｷｽﾄｴﾃﾞｨﾀｰによる編集は、HP制作ｿﾌﾄとの互換性の問題を生じません（HP制作ｿﾌﾄ間は少し生じる）。

　・　作動ﾃｽﾄは、ﾛｰｶﾙ（PC）に保存し、 Internet Explorer 8.x～などで開いて。　　　　更新の確認は [F5]ｷｰを押し、ｻｰﾊﾞｰやﾌﾞﾗｳｻﾞｰのｷｬｯｼｭｸﾘｱｰ、最新ﾃﾞｰﾀ読み込み（≠再ｱｸｾｽ）で行います。

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

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

　HTMLの編集方法　

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

〔この列ﾍﾟｰｽﾄ不要〕　

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

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

ﾘﾝｸを新しいWinで開くを標準（削除可）※：target=　いろいろ
同じﾌﾚｰﾑ=_self、ﾍﾟｰｼﾞ全体=_top、親ﾌﾚｰﾑ=_parent
お気に入り、ﾀｽｸﾊﾞｰに表示するﾍﾟｰｼﾞ名（≠ﾌｧｲﾙ名）

ﾀﾌﾞﾒﾆｭｰ

ｽﾗｲﾄﾞｼｮｰ

ﾏｳｽｵｰﾊﾞｰ展開ﾒﾆｭｰ（ﾘﾝｸﾃｰﾌﾞﾙ）

<title>サンプルページ　　Hello！…… のページへようこそ …* 12if1a</title>

<style type="text/css">
#ddimagetabs{
}

#ddimagetabs a{
display: block;
text-decoration: none;
font: bold 12px Tahoma;　　　　　/*　ﾀﾌﾞﾌｫﾝﾄ　　　　　*/
color: #535353;　　　　　　　　 /*　ﾀﾌﾞ文字色　　　　 */
width: 90px; 　　　　　　　　　　 /*　ﾀﾌﾞ画像幅　　　　　*/
height: 20px;　　　　　　　　　　 /*　ﾀﾌﾞ画像高さ（縮小のみ可）　　*/
float: left;
display: inline;
margin: 0px 0px 0px 0px;　　 /*　周り（上右下左）余白　　*/
padding: 1px 1px 1px 1px;　　　　 /*　内（上右下左）余白　　　*/
background-image:url(tbwhb.gif); /*　ﾀﾌﾞ画像URL+ﾌｧｲﾙ名　　　*/
background-repeat: no-repeat;
text-align: center;　　　　　　　 /*　ﾀﾌﾞ中央配置　　　　　　 */
}

#ddimagetabs a:hover, #ddimagetabs a.current{
background-image:url(tbskb.gif); /*　ﾏｳｽｵｰﾊﾞｰ時のﾀﾌﾞ画像URL+ﾌｧｲﾙ名　　*/
color:　#242425;　　　　　　　　　　 /*　ﾏｳｽｵｰﾊﾞｰ時のﾀﾌﾞ文字色　　　　　　　*/　
}

#tabcontentcontainer{
width:623px; 　　　　　　　　　　　　/*　ｺﾝﾃﾝﾂ幅　　　*/
height:40px;　　　　　　　　　　　　/*　ｺﾝﾃﾝﾂ高さ　　*/

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

//　初期表示ﾀﾌﾞ　　　[which tab (1=first tab), ID of tab content to display]:
var initialtab=[1, "sc1"]

//Turn menu into single level image tabs (completely hides 2nd level)?
var turntosingle=0　　　　　　 //0 for no (default), 1 for yes

//　ﾀﾌﾞﾘﾝｸの有無　　Disable hyperlinks in 1st level tab images?
var disabletablinks=0　　　　　 //0 for no (default), 1 for yes

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

<link rel="stylesheet" type="text/css" href="58761550.css" />
<script type="text/javascript" src="58761550.js">

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

</script>

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

　HTMLの編集方法　

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

〔この列ﾍﾟｰｽﾄ不要〕

※：<body>　部の編集　ｽﾗｲﾄﾞｼｮｰ
位置　初期画像
　

iframe name（ﾀｰｹﾞｯﾄ）　位置　ｻｲｽﾞ

吹き出し 背景画像（削除可）

ﾀﾌﾞ画像ﾊｲﾊﾟｰﾘﾝｸ　吹き出し ﾀｰｹﾞｯﾄ　ﾀﾌﾞ文字

以下、同様。

ﾃｰﾌﾞﾙ

ﾒﾆｭｰｺﾝﾃﾝﾂ（HTML）

WindowsMediaPlayer　位置　
ｻｲｽﾞ

音源URL

手動ｽﾀｰﾄ

ﾎﾞﾘｳﾑ

ﾏｳｽｵｰﾊﾞｰ展開ﾒﾆｭｰ（ﾘﾝｸﾃｰﾌﾞﾙ）

位置

説明・自由ｺﾝﾃﾝﾂ開始DIV　位置　幅

末尾</div>

<div style="position:absolute; top:155; left:1; width:634; height:55; z-index:0; visibility:visible; background-color:#FFFFFF" title="！"　 STYLE="filter:progid:DXImageTransform.Microsoft.Alpha( Opacity=85, FinishOpacity=85)" ; style="background-image: url('../wttec.gif')">

<div id="ddimagetabs">
<a href="http://　……　/jaHome" onMouseover="expandcontent('sc1', this)" title="ｴﾝﾀｰﾃｲﾒﾝﾄ・♪・Movie・News・Life - 日本" target="frame001">Media Player</a> <a href="http://　……　rs_and_Actresses/" onMouseover="expandcontent('sc2', this)" title="世界の女優Dir" target="frame001">女優</a> 　……　
</div><br style="clear:left" />
<table width="625" border="1" cellspacing="0" cellpadding="3" bgcolor="#FFFFF4" style="border-collapse: collapse" bordercolorlight="#F1F0FB" bordercolordark="#D5CED3">
<tr>
<td bgcolor="#FFFFFF" valign="top" align="left"; style="background-image: url(wttec.gif')">
<DIV id="tabcontentcontainer">
<div id="sc1" class="tabcontent">
<div id="sc1" class="tabcontent">
<a href="http://www.apple.com/quicktime/whatson/" target="frame001" title="ｱｯﾌﾟﾙ - ｸｲｯｸﾀｲﾑ　ｽﾄﾘｰﾐﾝｸﾞ TV ﾁｬﾝﾈﾙ〔｀。´ 〕">Music - Quick Time</a>

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

</div>

</td>
</tr>
</table>
</DIV>

</DIV>

<div style="position: absolute; top:154px; left:955px;">
<OBJECT ID="MediaPlayer1" width=250 height=68 classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" codebase="" standby="Microsoft Windowsｮ Media Player ｺﾝﾎﾟｰﾈﾝﾄを読み込んでいます。" type="application/x-oleobject">
<param name="URL" ref value="http://www　……　.asx">
<param name="rate" value="1">
<param name="balance" value="0">
<param name="currentPosition" value="0">
<param name="defaultFrame" value>
<param name="playCount" value="1">
<param name="autoStart" value="0">
<param name="currentMarker" value="0">
<param name="invokeURLs" value="-1">
<param name="baseURL" value>
<param name="volume" value="10">

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

<div style="position: absolute; top:164px; left:645px;">
<p style="text-align:left"><a href="http://xml-xsl.sakura.ne.jp/" target="_blank" class="anchorclass myownclass" rel="submenu3"><img src="http://xml-xsl.sakura.ne.jp/post_pet/upbutton.gif" border="0" alt="" width="44" height="44" title="新しいWinで、太陽風（ﾎｰﾑﾍﾟｰｼﾞ 2）を開きます。">　<img src="http://xml-xsl.sakura.ne.jp/post_pet/cat1.gif" border="0" width="15" height="15">　<img src="http://xml-xsl.sakura.ne.jp/post_pet/foot3.gif" border="0" width="14" height="12">　<img src="http://xml-xsl.sakura.ne.jp/post_pet/R2.gif" border="0" width="22" height="24"> 　Post Pet</a></p>

<div id="submenu3" class="anylinkcsscols">
<div class="column">
<b>Post Pet</b>

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

<li>　<a href="http://xml-xsl.sakura.ne.jp/sy001bm1.htm#11">11 女優・ﾓﾃﾞﾙ（＊＾．＾＊）</a></li>
<li></li>
</ul>
</div>
</div>

<script type="text/javascript">
//anylinkcssmenu.init("menu_anchors_class") //call this function at the very *end* of the document!
anylinkcssmenu.init("anchorclass")
</script>
</div>

<p><font><u>ﾎｰﾑ</u>へ　…、以下の説明部分は削除して使用。</font></p>

====　　この間自由ｺﾝﾃﾝﾂ（本例は説明文）、説明を省略。　　====

</div>

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

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