diff --git a/exam/Scripts/examInfo.js b/exam/Scripts/examInfo.js
index 5d8ed38..8465262 100644
--- a/exam/Scripts/examInfo.js
+++ b/exam/Scripts/examInfo.js
@@ -7,8 +7,8 @@ document.addEventListener("DOMContentLoaded", () => {
     const remainingTimeElem = document.getElementById("remaining-time");
     const statusElem = document.getElementById("status");
     const examTableBodyElem = document.getElementById("exam-table-body");
-    const roomElem = document.getElementById("room"); // 添加这一行
-    let offsetTime = getCookie("offsetTime") || 0; // 添加这一行
+    const roomElem = document.getElementById("room");
+    let offsetTime = getCookie("offsetTime") || 0;
 
     function fetchData() {
         return fetch('exam_config.json', { cache: "no-store" })
diff --git a/exam/Scripts/settings.js b/exam/Scripts/settings.js
index caf49e3..af3a424 100644
--- a/exam/Scripts/settings.js
+++ b/exam/Scripts/settings.js
@@ -23,7 +23,11 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 
     closeSettingsBtn.addEventListener("click", () => {
-        settingsModal.style.display = "none";
+        settingsModal.classList.add("fade-out");
+        setTimeout(() => {
+            settingsModal.style.display = "none";
+            settingsModal.classList.remove("fade-out");
+        }, 300);
     });
 
     saveSettingsBtn.addEventListener("click", () => {
@@ -35,7 +39,13 @@ document.addEventListener("DOMContentLoaded", () => {
         setCookie("zoomLevel", zoomLevel, 365);
         roomElem.textContent = room;
         document.body.style.zoom = zoomLevel;
-        settingsModal.style.display = "none";
+        settingsModal.classList.add("fade-out");
+        setTimeout(() => {
+            settingsModal.style.display = "none";
+            settingsModal.classList.remove("fade-out");
+        }, 300);
+        // 立即生效时间偏移
+        location.reload();
     });
 
     document.body.style.zoom = zoomLevel;
diff --git a/exam/Styles/dark.css b/exam/Styles/dark.css
index 5a52578..f38294b 100644
--- a/exam/Styles/dark.css
+++ b/exam/Styles/dark.css
@@ -207,6 +207,15 @@ td:last-child {
     to { opacity: 1; transform: translateY(0); }
 }
 
+@keyframes fadeOut {
+    from { opacity: 1; transform: translateY(0); }
+    to { opacity: 0; transform: translateY(-20px); }
+}
+
+.fade-out {
+    animation: fadeOut 0.3s ease;
+}
+
 #settings-modal-content h3 {
     margin: 0 0 20px;
     color: #e0e0e0;