// JScript 文件
var picList;
var picAlt;
var pid;
var pz;
var maxp;
var pct;

pid = 1;
pz =5;

initFUI();

function initFUI(){
var i = 0;

picList = new Array();
picAlt = new Array();

$("div#fpicData ul li img").each(function(){
picList[i] = this.src;
picAlt[i] = this.alt;
i++;
});
pct = i;
//--------------------
if(i%pz==0)
maxp =i/pz;
else
maxp =Math.floor(i/pz)+1;

//-----------------------
var fuiStr = ''; 
fuiStr += '<div class="show" style="width:500px;height:430px;background-color:white;padding:10px;border:1px solid #ccc;">';
fuiStr += '<a href="/picShow.shtml?picurl='+picList[0]+'&alt='+picAlt[0]+'" target="_blank"><img src="'+picList[0]+'" alt="'+picAlt[0]+'" width="10" height="10" class="fuiPic" onload="Resize(this,480,400)" /></a>'; 
fuiStr += '<div class="picobj" style="padding:5px;"> '+picAlt[0]+'</div>'; 
fuiStr += '</div>'; 

fuiStr += '<div class="listbox" style="background-image:url(/images/v2/fuibg.gif);margin-top:15px;border:1px solid #ccc;">';
fuiStr += '<div class="fl srcoll" style="width:30px;"><img src="/images/v2/arrow-l.gif" alt="" id="srcoll-l" /></div>';
fuiStr += '<div class="list fl" style="width:550px;overflow:hidden;">';
fuiStr += '<table cellspacing="2" cellpadding="2" style="margin-left:0px;" id="ptb"><tr>';

var sid = (pid-1)*pz;
var eid =  sid + 5;
if(eid>i)
eid =i;

for(j= sid;j<eid;j++){
fuiStr += '<td  style="width:110px;height:110px;text-align:center"><img src="'+picList[j]+'" alt="'+picAlt[j]+'" width="10" height="10" class="fuiPic" onload="Resize(this,100,100)" /></td>';
}
fuiStr += '</tr></table>';
fuiStr += '</div>'; 

fuiStr += '<div class="fl srcoll" style="width:30px;"><img src="/images/v2/arrow-r.gif" alt="" id="srcoll-r" /></div>';
fuiStr += '<div class="cf" ></div>';
fuiStr += '</div>';


$("div#fpicData").html(fuiStr);
$("div#fpicData").css({"text-align":"center"});
$("div#fpicData").fadeIn();

//-------------------------------------------------------
$("div#fpicData table img").each(function(){
$(this).css({"opacity":".8"});

$(this).mouseover(function(){ 
$(this).css({"border":"1px solid #fff","opacity":"1"});
});

$(this).mouseout(function(){ 
$(this).css({"border":"1px solid #ccc","opacity":".8"});
});

});

$("div#fpicData table img").click(function(){
$("div#fpicData div.show img")[0].src=this.src;
$("div#fpicData div.show a")[0].href='/picShow.shtml?picurl='+this.src+'&alt='+this.alt;
$("div#fpicData div.show div.picobj").html(this.alt);
});

//-----------------------------------------
$("div.srcoll img").each(function(){
$(this).css({"opacity":".8","cursor":"hand"});

$(this).mouseover(function(){ 
$(this).css({"opacity":"1"});
});

$(this).mouseout(function(){ 
$(this).css({"opacity":".8"});
});

});
//----------------------------------

$("img#srcoll-l").click(function(){
pid = pid -1;
if(pid<=0)
pid=1;

setplist();
});

$("img#srcoll-r").click(function(){
pid = pid +1;
if(pid>=maxp)
pid=maxp;

setplist()
});

}


function setplist(){

var fuiStr = ''; 
fuiStr += '<tr>';

var sid = (pid-1)*pz;
var eid =  sid + 5;
if(eid>pct)
eid =pct;

for(j= sid;j<eid;j++){
fuiStr += '<td  style="width:110px;height:110px;text-align:center"><img src="'+picList[j]+'" alt="'+picAlt[j]+'" width="10" height="10" class="fuiPic" onload="Resize(this,100,100)" /></td>';
}
fuiStr += '</tr>';

$("table#ptb").html(fuiStr);

//-------------------------------------------------------
$("div#fpicData table img").each(function(){
$(this).css({"opacity":".8"});

$(this).mouseover(function(){ 
$(this).css({"border":"1px solid #fff","opacity":"1"});
});

$(this).mouseout(function(){ 
$(this).css({"border":"1px solid #ccc","opacity":".8"});
});

});

$("div#fpicData table img").click(function(){
$("div#fpicData div.show img")[0].src=this.src;
$("div#fpicData div.show a")[0].href='/picShow.shtml?picurl='+this.src+'&alt='+this.alt;
$("div#fpicData div.show div.picobj").html(this.alt);
});

//-----------------------------------------

}