原创的图片加载效果---全采用Javascript来实现
直接进入正题：
字串2
实现效果：如何快速加载30张或者更多的图片！ 字串2
实现方式：
字串7
如：当前要加载30张的组图，如果一次性用<img src=的方式进行，这会显示到显示速度，我采用脚本的方式，对30张图片分批加载，并且是有序的进行，过程为：第1张加载完后，加载第2张... 这样下去.......
假设我设定每次加载数为4张(可自定)，它的过程是提取前4张图，进行第1张加载完后，加载第2张.......当加载完第4张后，进行一次停顿，这样，显示效果就不会因为加载东西，而卡住～！等过了停顿时间后，又开始继续加载下一组～！这样循环到全部图片都加载完成～！
虽然效果还不是很让我满意的结果，但真正意义上实现了加载速度的问题～！后来，还发现一个更好的东西～！
字串6
代码都是开源的，直接查看我站里的源码就可以复制了～！大家再研究一下有没有更好的方式～！ 字串5
后期我可能会想用Flash来实现看看，因为Flash效果一定是比较多的．．．不过，就是用起来不方式～
主要代码如下:
<script defer="defer">
var PicMaxs = "20"
var DQPicID = 1;
var DQShowPicID = 1;
var IsUrlOk = 0;
var WebPicUrl = "http://www2.ff369.com/";
document.getElementById("picinfo").innerHTML = " <font color=#000000>宾馆里的小情人惹火身材</font><br> <font color=red>精品套图</font><br> 共 <b><font color=red>20</font></b> 张组图";
var IsStop = 0;
function RLoadPic()
{
if (IsStop==0)
{
setTimeout("LoadPic()",100)
}
}
function GoOnLoad()
{
IsStop = 0;
setTimeout("LoadPic()",100)
}
function SetPicListHeight(ImgD)
{
var image=new Image();
IsUrlOk = 1;
image.src=ImgD.src;
document.getElementById("LoadPic").style.display='none';
字串3
document.getElementById("PShowPic").style.display='block';
// document.getElementById("PicList").style.height=image.height;
if (image.height==0)
{
// document.getElementById("PicList").style.height = 500;
}
winfixT();
scroll(0,130);
}
function ShowPic(ImgD,ShowPID)
{
DQShowPicID = ShowPID;
document.getElementById("PShowPic").style.display='none';
document.getElementById("LoadPic").style.display='block';
//document.getElementById("PicList").style.height=180;
document.getElementById("PShowPic").src = ImgD.src;
}
function winfixT() {
var width=screen.availWidth-2
var height=screen.availHeight;
self.resizeTo(width, height);
self.moveTo(0, 0);
}
function ShowNextPic()
字串3
{
document.getElementById("PShowPic").style.display='none';
document.getElementById("LoadPic").style.display='block';
document.getElementById("PicList").style.height=180;
if (DQShowPicID<=DQPicID)
{
if (DQShowPicID>=PicMaxs)
{
DQShowPicID = 1;
}
else
{
DQShowPicID = DQShowPicID +1;
}
NextPic = WebPicUrl+'200805/066/BigBull_'+ DQShowPicID +'.jpg';
document.getElementById("PShowPic").src =NextPic;
字串2 }
}
function LoadPic()
{
var TableHtml = "";
var NextPic;
if (DQPicID<=PicMaxs)
{
NextPic = WebPicUrl+'200805/066/BigBull_'+ DQPicID +'.jpg';
TableHtml = '<div id="PicIMGT" style="float:left;cursor: hand;">';
TableHtml = TableHtml + '<img src="'+ NextPic +'" onclick="ShowPic(this,'+ DQPicID +')" onload="javascript:RLoadPic();" width=112 height=110/></div>';
document.getElementById("PicList").innerHTML = document.getElementById("PicList").innerHTML + TableHtml;
DQPicID = DQPicID + 1;
if ((DQPicID % 4)==0)
{
IsStop = 1;
字串8
setTimeout("GoOnLoad()",3000)
}
}
}
function CheckIsUrlOk()
{
if (IsUrlOk==0)
{
WebPicUrl = "
http://www1.ff369.com/";
document.getElementById("PShowPic").src = WebPicUrl+'200805/066/BigBull_1.jpg';
}
}
setTimeout("CheckIsUrlOk()",1000)
</script>
字串8
