サンプルページ　　　テキストアニメ

ﾎｰﾑ　へ　　　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　ﾃｷｽﾄｱﾆﾒ　text_anime.htm

ﾊﾞﾅｰなどのﾃｷｽﾄを滲ませ、巡に切り替え。　　　　　　DHTML、CSS。　　　　　ﾃｷｽﾄや、配置・ｻｲｽﾞ・配色・ｱﾆﾒ効果の作動速度などのｶｽﾀﾏｲｽﾞ簡単。　　　　Internet Explorer5.x～対応。　　　　　ｺﾋﾟｰ、編集し、簡単にWebで応用できます。

<ご使用方法>

・　ﾛｰｶﾙ（=PC）への保存は、text_anime.htm、slidefader.gif、を右ｸﾘｯｸします。　　　[対象をﾌｧｲﾙに保存] - 【ﾌｧｲﾙのﾀﾞｳﾝﾛｰﾄﾞ】、【ﾌｧｲﾙ名を付けて保存】 - <保存する場所>： ……、などで行います。　　　　※1:ﾃｷｽﾄｴﾃﾞｨﾀｰによる編集は、HP制作ｿﾌﾄとの互換性の問題を生じません（HP制作ｿﾌﾄ間は多少ある）。　　　 ※2:hogehoge.html ：制作者が名付けた挿入先ﾌｧｲﾙの総称。

　・　このDHTMLの実装方法は、　text_anime.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 と同じ階層〔ﾎﾙﾀﾞｰ/ﾃﾞｨﾚｸﾄﾘｰ〕に、使用する画像なども転送/配置し実施。　　※：別ﾃﾞｨﾚｸﾄﾘｰに配置時は、*.html 中のﾊﾟｽは要修正。　　　FTPなどで変わったﾌｧｲﾙ名は要修正。　　　　ｽｸﾘﾌﾟﾄ構文中への改行混入は非作動原因。

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

　HTMLの編集方法　

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

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

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

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

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

配置　　ｻｲｽﾞ

ﾃｷｽﾄｻｲｽﾞ　書体　配置

ﾃｷｽﾄ色

縁(滲み効果)色

配置

ﾃｷｽﾄ

[x]行の追加・変更・削除でﾃｷｽﾄの変更可。

配置

ｻｲｽﾞ

ｱﾆﾒ速度

<title>サンプルページ　　テキストアニメ</title>

.textstyle {

position:absolute;

left:-2000px;

width:400px;

font-family:ＭＳＰ　ゴシック;MS Gothic;Arial;

font-size:18pt;

font-weight:bold;

text-align:center;

color:#00FFE1;

filter:glow(color=#5A00A0,strength=2);

}

.coverstyle {

position:absolute;

left:-2000px;

}

</style>

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

message[0]="=(・。.・)=　ようこそ、…*。<br>　太陽風ДζΨΠ∀へ"

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

message[6]="　追加、……　……　　　　　　　…*"

var i_message=0

// The trick of this script is a simple gif-image

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

var covertop=30

var coverleft=150

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

var coverwidth=1200

var coverheight=96

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

var textwidth=400

var textheight=coverheight

var cliptop=0

var clipright=textwidth

var clipbottom=coverheight

var clipleft=0

var clippoints

// Configure the speeds of the wipeing effect

var step=40

var pause=150

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

</script>

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

HTMLの編集方法　

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

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

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

追加します。

ﾃｷｽﾄｱﾆﾒの表示位置に記述します。

if (document.all&&window.print){

document.write('<DIV ID="text" class="textstyle">'+message[0]+'</div>')

document.write('<DIV ID="cover" class="coverstyle"><img src="slidefader.gif"></DIV>')

}

</script>

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

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