diff --git a/index.html b/index.html
index 39483bb..b7536e6 100644
--- a/index.html
+++ b/index.html
@@ -1,34 +1,32 @@
 <!DOCTYPE html>
 <html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>pop up message</title>
+    </head>
 
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>pop up message</title>
-</head>
-
-<body>
-    <button>popup</button>
-    <input type="text">
-    <script type="module">
-        import LLmessage from './index.ts'
-        const btn = document.querySelector('button')
-        const text = document.querySelector('input')
-        btn.addEventListener('click', () => {
-            // LLmessage(text.value || 'This is a message')
-            LLmessage({
-                text: text.value || 'This is a message',
-                style: {
-                    color: '#fff',
-                    background: '#6cf',
-                    transition: 'all .5s',
-                    padding: '10px 15px'
-                },
-                deviation: 100
-            })
-        })
-    </script>
-</body>
-
+    <body>
+        <button>popup</button>
+        <input type="text" />
+        <script type="module">
+            import LLmessage from './index.ts';
+            const btn = document.querySelector('button');
+            const text = document.querySelector('input');
+            btn.addEventListener('click', () => {
+                // LLmessage(text.value || 'This is a message')
+                LLmessage({
+                    text: text.value || 'This is a message',
+                    style: {
+                        color: '#fff',
+                        background: '#6cf',
+                        transition: 'all .3s',
+                        padding: '10px 15px'
+                    },
+                    deviation: 70
+                });
+            });
+        </script>
+    </body>
 </html>
diff --git a/index.ts b/index.ts
index 9261b1a..f7a20f7 100644
--- a/index.ts
+++ b/index.ts
@@ -39,7 +39,7 @@ function popupMsg(msg: string, time: number, dev: number, style?: style) {
         top: 0,
         left: '50%',
         transform: 'translateX(-50%) translateY(-100%)',
-        transition: 'all 300ms',
+        transition: 'all 100ms',
         'word-break': 'break-all',
         'font-size': '14px'
     };
@@ -49,14 +49,14 @@ function popupMsg(msg: string, time: number, dev: number, style?: style) {
     document.body.appendChild(box);
     setTimeout(() => {
         box.style.top = `${dev}px`;
-    })
+    });
     setTimeout(() => {
         box.style.top = '0';
-        let dur: number | string = box.style.transitionDuration
+        let dur: number | string = box.style.transitionDuration;
         if (/ms$/.test(dur)) {
-            dur = parseFloat(dur)
-        }else {
-            dur = parseFloat(dur) * 1000
+            dur = parseFloat(dur);
+        } else {
+            dur = parseFloat(dur) * 1000;
         }
         setTimeout(() => {
             document.body.removeChild(box);
