在Flash中常见的JavaScript HTML 5 Canvas图像"页面翻转",可以通过以下步骤实现:
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
function flipCanvas(ctx, type, center) {
ctx.translate(center, center);
if (type === "horizontal") {
ctx.scale(-1, 1);
} else if (type === "vertical") {
ctx.scale(1, -1);
}
ctx.translate(-center, -center);
}
// 水平翻转
flipCanvas(ctx, "horizontal", canvas.width / 2);
// 垂直翻转
flipCanvas(ctx, "vertical", canvas.height / 2);
var image = new Image();
image.src = "your-image-url";
image.onload = function () {
ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
};
这样,您就可以在Flash中常见的JavaScript HTML 5 Canvas图像上实现"页面翻转"效果了。
领取专属 10元无门槛券
手把手带您无忧上云