・　このサンプルの使い方

　SCRIPTタグを使わないスライドショーです。ショッピングサイトやブログなど、SCRIPTタグを禁止しているページに利用できます。ただし、他の禁止事項がある場合は動かない事があります。

　下のボタンをクリックすると、スライドショーのソースが現れます。 stopボタン画像と、下記「写真ファイルの制作」を参照して写真を用意し、ソースをスライドショーを貼り付けるページソースの貼り付ける場所にコピーしてください。 貼り付けられるスライドショーは１ページに１個です。

<!-- width:〜;height:〜;に写真のサイズ。↓ --> <div style="position:relative;top:0px;left:0px;width:640px;height:480px;margin:auto;"> <!-- sl(this,写真の枚数,スライドショー速度);を記述。↓ --> <img src="0.jpg" style="position:absolute;top:0px;left:0px;cursor:pointer;" onclick="sl(this,10,5000);b_obj.style.visibility='visible';" title="start or next" /> <!-- src="〜"にstopボタン画像のファイル名。↓ --> <img src="stop001.png" style="position:absolute;bottom:15px;right:20px;visibility:hidden;cursor:pointer;filter:alpha(opacity=30);opacity:0.3;" onload="i=0;tid='';b_obj=this;sl=function(obj,n,obo){var tugi=function(){i++;i%=n;obj.src=i+'.jpg';};clearInterval(tid);tugi();tid=setInterval(tugi,obo);};" onclick="clearInterval(tid);this.style.visibility='hidden';" title="stop" /> </div>

・　表示例

　写真をクリックするとスライドショーが開始され、「stop」ボタンが現れます。スライドショーの作動中に写真をクリックすると次の写真に切り替わります。 「stop」ボタンは画像ですから、サンプルのstop画像をコピーするか、お手持ちのボタン画像に交換してください。

　スライドショーの速度や写真の枚数は、ソース中の　onclick="sl(this,10,5000);〜;"　部分に記述します。10が枚数で5000（ミリ秒）が速度です。

・　写真ファイルの制作

　拡大表示に使用する写真（jpg形式）を用意します。自由な大きさで結構です。次に、写真のファイル名を0.jpgから始まる通し番号に変更します。例えば写真の数が５枚ならファイル名は、0.jpg　1.jpg　2.jpg　3.jpg　4.jpgとなりまが、１０枚以上の場合に 9.jpg の次は 10.jpg としてください。拡張子は小文字の jpg にしてください。一覧はこの写真を縮小して表示します。

　制作した写真ファイルは、スライドショーを貼り付けたＨＴＭＬファイルと同じホルダーに置いて下さい。

戻る

All Rights Reserved. Copyright (C) 2002- Miyake_kobo.