diff --git a/main.js b/main.js
index d3beb4a..3acf30a 100644
--- a/main.js
+++ b/main.js
@@ -6,7 +6,15 @@ let imgh = [0, 0, 0]
 let ani_mode = 0
 
 let vh = window.innerHeight / 100;
-let vw = window.innerWidth / 100;;
+let vw = window.innerWidth / 100;
+
+function sleep(millisecond) {
+    return new Promise(resolve => {
+        setTimeout(() => {
+            resolve()
+        }, millisecond)
+    })
+}
 
 window.onload = function () {
     dropBox = document.getElementById("dropbox");
@@ -233,7 +241,7 @@ function scale_size_ma() {
     }
 }
 
-function scale(index, scale_x, scale_y) {
+async function scale(index, scale_x, scale_y) {
     canvas = canvass[index]
     cxt = canvas.getContext("2d")
     imgData = cxt.getImageData(0, 0, canvas.width, canvas.height);
@@ -244,6 +252,16 @@ function scale(index, scale_x, scale_y) {
     ori_w = imgData.width;
     ori_h = imgData.height;
 
+    if (ani_mode) {
+        document.getElementById("c2").style.display = "flex"
+        document.getElementById("c2").append(canvas2);
+        document.getElementById("c1").style['justify-content'] = "center"
+        document.getElementById("c2").style['justify-content'] = "center"
+
+        document.getElementById("c1").style.width = 70 * vw / (scale_x + 1) + "px"
+        document.getElementById("c2").style.width = 70 * vw * scale_x / (scale_x + 1) + "px"
+    }
+
     canvas2.setAttribute("height", ori_h * scale_y + "px");
     canvas2.setAttribute("width", ori_w * scale_x + "px");
     canvas2.setAttribute("id", "canvas_" + index)
@@ -266,6 +284,7 @@ function scale(index, scale_x, scale_y) {
             ctx.fillStyle = "rgba(" + red + "," + green + "," + blue + "," + alpha + ")";
             ctx.fillRect(j, i, 1, 1)
         }
+        await sleep(10);
     }
 
     let imgdata = canvas2.toDataURL();
@@ -273,7 +292,6 @@ function scale(index, scale_x, scale_y) {
     newImg.src = imgdata;
 
     if (multi == 1) {
-
         newImg.setAttribute("width", 20 * vw + "px")
         document.getElementById("img_" + index).replaceChild(newImg, imgs[index]);
         document.getElementById("img_" + index).getElementsByTagName("div")[0].innerHTML = "[" + (index + 1) + "] " + canvas2.width + " x " + canvas2.height;
@@ -287,6 +305,15 @@ function scale(index, scale_x, scale_y) {
 
         document.getElementById("size").innerHTML = "尺寸：" + canvas2.width + " x " + canvas2.height
 
+        if (ani_mode) {
+            await sleep(500);
+            document.getElementById("c1").style.width = 70 * vw + "px"
+            document.getElementById("c2").style.display = "none";
+            document.getElementById("c2").removeChild(canvas2);
+        }
+
+        if (canvas2.height > 90 * vh) document.getElementById("c1").style['justify-content'] = "flex-start";
+
         document.getElementById("c1").replaceChild(newImg, imgs[index]);
         canvasList.replaceChild(canvas2, canvass[index]);
 
@@ -315,7 +342,7 @@ function saveImg() {
 
 function animatePic() {
     ani_mode = !ani_mode
-    if(ani_mode){
+    if (ani_mode) {
         document.getElementById("ani_but").style.color = "red"
     }
     else {