图片预加载

最新推荐文章于 2025-08-11 23:19:59 发布

Mh_ui

最新推荐文章于 2025-08-11 23:19:59 发布

阅读量254

点赞数

CC 4.0 BY-SA版权

文章标签： javascript

本文链接：https://blog.youkuaiyun.com/Mh_ui/article/details/78519967

本文介绍了一个使用JavaScript实现的图片加载进度显示程序。该程序通过控制台输出当前加载的图片编号，并利用jQuery动态更新已加载图片数量及加载进度百分比。当所有图片加载完毕后，隐藏背景元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var count=0,
    img="";
for(var i = 1; i <= 72; i++){
	console.log(i);
	if(i<10){
	    img="img/"+color+"/D2UC_"+color+"_000"+i+".jpg";
	}else{
	    img="img/"+color+"/D2UC_"+color+"_00"+i+".jpg";
	}					
	$("<img/>").attr("src",img).load(function(){
	    count++;
	    $(".load_txt span").html(parseInt(count/72*100)+"%");
	    $(".carpng").css("margin-left",parseInt(count/72*100)+"%");
	    if(parseInt(count/72*100)==100){
		  setTimeout(function(){
		      $(".bg").hide();
		  },500);
	    }
	})
}