keyFrames在前端页面添加序列帧动画

最新推荐文章于 2024-08-23 15:35:33 发布

qq_22266149

最新推荐文章于 2024-08-23 15:35:33 发布

阅读量1.8k

点赞数

本文链接：https://blog.csdn.net/qq_22266149/article/details/89147194

版权

var aofeikeyFrames;
function keyFrames(id, img, width, height, keyFrames){
	keyFrames = new CanvasKeyFrames(document.querySelector(id), 'sprite', img, {
		fps:10,
		imgWidth:width,
		imgHeight:height,
		width:50,
		height:50
	});
	keyFrames.play();
}

var aofei = new Image();
	aofei.src = 'img/en_aofei.png';
	$(".aofei").css("width", '7.5rem');
	$(".aofei").css("height", '1.8975rem');
	$(".aofei").css("margin-right", '-9.5rem');
	$(".aofei").css("margin-bottom", '-7rem');
	aofei.onload = function(){
		aofei.onload = null;
		keyFrames(".aofei", aofei, 373, 120, aofeikeyFrames);//div对象  对应图片   序列帧动画宽度  序列帧动画高度 指定序列帧对象
    }