プログラムの特徴
・ ファイルがスタートすると徐々に背景画像が現れ、徐々に消えます・ 指定した背景画像を順番に表示し、繰り返します ・ 数値の設定だけで、背景画像の表示の調整が出来ます。 設定方法 まず、「ソースファイル」を、指示に従いコピーアンドペーストします。 （１）<body> に置き換える部分は、そのままコピーアンドペーストします。 ■ <body>内の、独自の属性は適宜足して下さい。ただし、背景画像の指定はしないでください。 <body bgcolor="#ffffff" style="margin:0;"> <div id="screen" style="width:100%; height:100%; background-image:url(); filter:alpha(style=0,opacity=0)"> （２）「入力事項」の部分で、色に合わせて、次の設定をします。 太字は入力可能場所。 ■ 「0」から順に表示したい数の画像を、アドレスを含むファイル名で指定します。 ■ 各画像ごとの表示時間を秒数で入力します。 ■ 画像が徐々に変化する速さの値を入力します。 数字が大きいほどゆっくり変化します。（秒数ではありません） ■ その他、必要に応じて、指示に従い設定してください。 ベースとなる背景色は、予め body タグ内で指定して下さい。 （注意）body タグ内で背景画像を指定しないで下さい。 // **************************** 入力事項 ******************************* // ======= 入力１：画像の種類と表示時間 // 出したい背景画像の種類を必要数（下記の動きを併せ）だけ入力（0から順に） // 「new Array("」以降 画像ファイル名 , 表示する時間（秒） の順に入力する。 image[ 0 ]=new Array(" ../parts/hai1.gif " , 4.0 ); image[ 1 ]=new Array(" ../parts/hai2.gif " , 4.0 ); image[ 2 ]=new Array(" ../parts/hai3.gif " , 4.0 ); image[ 3 ]=new Array(" ../parts/hai4.gif " , 4.0 ); // ======= 入力２：表示・消滅の速さの調整 var ed= 100; // 画像が徐々に変化する時間で、大きいほど長い（初期値 100） // 速さが足りない（荒い）場合は、次の数値を大きくする var chg= 10; // 一秒当たりの描画の切替え回数 （初期値 10 回） // ************************* 入力事項ここまで **************************** 更新履歴
・03/11/13 ver 0.10 内部構造の修正・03/04/13 ver 0.00 初 公 開 使用画像
・ 画像は、Engel Heart さんから借りました。。
ソースファイル
・ まず、下記の部分を、<body> に置き換えて下さい。（独自の属性は適宜足して下さい）ただし、body タグ内で背景画像を指定しないで下さい。 <body bgcolor="#ffffff" style="margin:0;"> <div id="screen" style="width:100%; height:100%; background-image:url(); filter:alpha(style=0,opacity=0)">
</div>
<script type="text/javascript">
<!--// decr_01 ver0.10 （ぱーぷりんの溜まり場）
image=new Array(); // この行はさわらないで・・
// **************************** 入力事項 *******************************
// ======= 入力１：画像の種類と表示時間
// 出したい背景画像の種類を必要数（下記の動きを併せ）だけ入力（0から順に）
// 「new Array("」以降 画像ファイル名 , 表示する時間（秒） の順に入力する。
image[ 0 ]=new Array(" ../parts/hai1.gif " , 4.0 );
image[ 1 ]=new Array(" ../parts/hai2.gif " , 4.0 );
image[ 2 ]=new Array(" ../parts/hai3.gif " , 4.0 );
image[ 3 ]=new Array(" ../parts/hai4.gif " , 4.0 );
// ======= 入力２：表示・消滅の速さの調整
var ed= 100; // 画像が徐々に変化する時間で、大きいほど長い（初期値 100）
// 速さが足りない（荒い）場合は、次の数値を大きくする
var chg= 10; // 一秒当たりの描画の切替え回数 （初期値 10 回）
// ************************* 入力事項ここまで ****************************
// ----- 共通変数・配列の設定 -----
var no = image.length-1, inc=0, ii=0;
document.all("screen").style.backgroundImage="url("+image[ii][0]+")";
inc_sakura();
// ----- 徐々に表示する -----
function inc_sakura() {
document.all("screen").filters("alpha").opacity = inc;
if(inc<=100) {
inc+=400/ed; tim=setTimeout("inc_sakura()",1000/chg) }
else {
clearTimeout(tim); inc=100;
setTimeout("dec_sakura()", 1000*image[ii][1]) } }
// ----- 徐々に消す -----
function dec_sakura() {
document.all("screen").filters("alpha").opacity = inc;
if(inc>0) {
inc-=400/ed; tim=setTimeout("dec_sakura()",1000/chg) }
else {
clearTimeout(tim); inc=0; ii++;
if (ii>no) { ii=0 };
document.all("screen").style.backgroundImage="url("+image[ii][0]+")";
inc_sakura() } }
// -->
</script>
|