画像のスライドショウをJavaScriptで試してみた。NetCommonsには、既定のモジュールに「フォトアルバム」があり、これを利用すれば、スライドショウは表示出来る。この事例では、ボタンで開始と停止が出来る程度の違い。尚、ショウの時間間隔の設定は5秒。
この事例では、5枚の写真(画像1のメニューで利用したもの)を利用しており、前提として画像のアップロードした時の画像のURL(id=)が連続していること。
1.初期画像をアップロード後、HTML編集で「id="img1」を入れる。
img1は任意の文字列。
2.JavaScriptのソース
imgs=new Array(5);
interval = 0;
for (var i=0;i<5;i++){
imgs[i]=new Image();
imgs[i].src="./?action=common_download_main&upload_id="+(159+i);
}
var n=0;
function change(){
document.getElementById("img1").src=imgs[n].src;
n++;
if(n==5){n=0}
}
function kaisi(){
interval = document.sshowform.intervalset.value;
var err_cnt = 0;
for (i=0; i<=interval.length-1; i++){
char = interval.charAt(i);
if (char < "0" || char > "9"){
err_cnt=err_cnt+1; }
}
if(interval<1 || interval>15){
err_cnt=err_cnt+1;}
if (err_cnt > 0){
alert("Input data Error");
}
else{
interval = parseInt(document.sshowform.intervalset.value)*1000;
timer1=setInterval("change()",interval);
}
}
function teisi(){
clearInterval(timer1);
}