Jul
11
前段时间把我姐的网站进行升级了,把相册改成用ajax调用,这样可以提高用户体验.但是引发出一个问题,就是点下一张以后,新图片的显示会很慢.
以前为什么会没有这样的感觉呢?
1,我们的注意还是留在页面的渲染上
2,由浏览在打开页面里会顺便把图片也下载会回,所以整体来说点用的时间会比较小.不用重新打开端口
解决的方法是预先把图片先载入到页面上,最基本上载入方法
<script>
var _img=new Image();
_img.src="123.jpg";
</script>
但我的是一组图片的
所以我需要批量载入
<script>
var imglist=new Array('1.jpg0,'2.jpg');
var _imglist=new Array();
for(i=0;i<imglist.length;i++)
{
_imglist[i]=new Image();
_imglist[i].src=imglist[i];
}
</script>
虽然我已经发了命令去让浏览器载入图片,但是还有问题,如果载入命令发出了.但系图片还是没有载入成功,那还是让用户在点下一张后等待
我想要减小用户等待的时间,所以只有当所用图片都载入程序后,再进行图片显示的操作
<script>
var imglist=new Array('1.jpg0,'2.jpg');
var _imglist=new Array();
var _cache_list_length=imglist.length;
for(i=0;i<imglist.length;i++)
{
_imglist[i]=new Image();
_imglist[i].src=imglist[i];
_imglist[i].onload=function()
{
_cache_list_length--;
}
}
function STO_show()
{
if(_cache_list_length==0)
{
show();
}
else
{
setTimeOut("STO_show();",3);
}
}
function show()
{
alert(_imaglist[0]);
}
</script>
完成了.所有图片都会提前载入,然后就不会有每张图片都需要等待了
以前为什么会没有这样的感觉呢?
1,我们的注意还是留在页面的渲染上
2,由浏览在打开页面里会顺便把图片也下载会回,所以整体来说点用的时间会比较小.不用重新打开端口
解决的方法是预先把图片先载入到页面上,最基本上载入方法
<script>
var _img=new Image();
_img.src="123.jpg";
</script>
但我的是一组图片的
所以我需要批量载入
<script>
var imglist=new Array('1.jpg0,'2.jpg');
var _imglist=new Array();
for(i=0;i<imglist.length;i++)
{
_imglist[i]=new Image();
_imglist[i].src=imglist[i];
}
</script>
虽然我已经发了命令去让浏览器载入图片,但是还有问题,如果载入命令发出了.但系图片还是没有载入成功,那还是让用户在点下一张后等待
我想要减小用户等待的时间,所以只有当所用图片都载入程序后,再进行图片显示的操作
<script>
var imglist=new Array('1.jpg0,'2.jpg');
var _imglist=new Array();
var _cache_list_length=imglist.length;
for(i=0;i<imglist.length;i++)
{
_imglist[i]=new Image();
_imglist[i].src=imglist[i];
_imglist[i].onload=function()
{
_cache_list_length--;
}
}
function STO_show()
{
if(_cache_list_length==0)
{
show();
}
else
{
setTimeOut("STO_show();",3);
}
}
function show()
{
alert(_imaglist[0]);
}
</script>
完成了.所有图片都会提前载入,然后就不会有每张图片都需要等待了
lee
July 27, 2008 11:10
这是一条隐藏评论或留言。您需要以合适的身份登入后才能看到。
bkkkd 回复于 July 28, 2008 07:23
小卡弟弟,你也很有才呀!
分页: 1/1 1