diff --git a/src/layouts/AdminLayout.vue b/src/layouts/AdminLayout.vue
index 7522c27..b697295 100644
--- a/src/layouts/AdminLayout.vue
+++ b/src/layouts/AdminLayout.vue
@@ -11,7 +11,7 @@ const collapsed = ref(false)
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
@@ -178,6 +178,7 @@ const navigateTo = (path) => {
 <style scoped>
 /* 自定义样式 */
 .admin-layout {
+  min-width: 100vh;
   min-height: 100vh;
 }
 
diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index 4d9afed..21946af 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -29,7 +29,7 @@ onMounted(() => {
   })
 
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/admin/Dashboard.vue b/src/views/admin/Dashboard.vue
index 08537a2..18bc3c9 100644
--- a/src/views/admin/Dashboard.vue
+++ b/src/views/admin/Dashboard.vue
@@ -5,7 +5,7 @@ import 'aos/dist/aos.css'
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/admin/ProjectsCRUD.vue b/src/views/admin/ProjectsCRUD.vue
index 822b94d..60870e3 100644
--- a/src/views/admin/ProjectsCRUD.vue
+++ b/src/views/admin/ProjectsCRUD.vue
@@ -5,7 +5,7 @@ import 'aos/dist/aos.css'
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/frontend/About.vue b/src/views/frontend/About.vue
index 2049c26..573b988 100644
--- a/src/views/frontend/About.vue
+++ b/src/views/frontend/About.vue
@@ -6,7 +6,7 @@ import 'aos/dist/aos.css'
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/frontend/Detail.vue b/src/views/frontend/Detail.vue
index 08d7115..d2d3913 100644
--- a/src/views/frontend/Detail.vue
+++ b/src/views/frontend/Detail.vue
@@ -16,7 +16,7 @@ const modules = [Autoplay, Pagination, Navigation, EffectFade]
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/frontend/Home.vue b/src/views/frontend/Home.vue
index 867e9a3..5140994 100644
--- a/src/views/frontend/Home.vue
+++ b/src/views/frontend/Home.vue
@@ -13,7 +13,7 @@ const modules = [Autoplay, Pagination, Navigation, EffectFade]
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/frontend/Personal.vue b/src/views/frontend/Personal.vue
index af26590..2188cea 100644
--- a/src/views/frontend/Personal.vue
+++ b/src/views/frontend/Personal.vue
@@ -22,7 +22,7 @@ const userData = ref({
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
diff --git a/src/views/frontend/Projects.vue b/src/views/frontend/Projects.vue
index 5624d06..c8c5dee 100644
--- a/src/views/frontend/Projects.vue
+++ b/src/views/frontend/Projects.vue
@@ -5,7 +5,7 @@ import 'aos/dist/aos.css'
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: false
@@ -71,6 +71,26 @@ const formatDate = (dateString) => {
 const formatPrice = (price) => {
   return '¥ ' + parseFloat(price).toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
 }
+
+const getAosEffect = (index) => {
+  const screenWidth = window.innerWidth;
+  let itemsPerRow;
+  if (screenWidth >= 1024) { // PC
+    itemsPerRow = 3;
+  } else if (screenWidth >= 768) { // 平板
+    itemsPerRow = 2;
+  } else { // 手机
+    itemsPerRow = 1;
+  }
+  const rowIndex = Math.floor(index / itemsPerRow);
+  const colIndex = index % itemsPerRow;
+  const aosEffects = [
+    ['fade-up', 'fade-down', 'fade-left'],
+    ['fade-right', 'zoom-in', 'zoom-out'],
+    ['flip-left', 'flip-right', 'slide-up']
+  ];
+  return aosEffects[rowIndex % aosEffects.length][colIndex % aosEffects[0].length];
+}
 </script>
 
 <template>
@@ -146,10 +166,10 @@ const formatPrice = (price) => {
       <!-- 项目卡片网格 -->
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
         <div
-            v-for="project in filteredProjects"
+            v-for="(project, index) in filteredProjects"
             :key="project.id"
             class="group bg-white dark:bg-gray-800 rounded-3xl shadow-lg hover:shadow-xl transition-all duration-500 overflow-hidden transform hover:-translate-y-2 cursor-pointer"
-            data-aos="fade-up"
+            :data-aos="getAosEffect(index)"
             @click="$router.push(`/project/${project.id}`)"
         >
           <div class="relative h-56 overflow-hidden">
diff --git a/src/views/frontend/Services.vue b/src/views/frontend/Services.vue
index 064b4c3..83f7194 100644
--- a/src/views/frontend/Services.vue
+++ b/src/views/frontend/Services.vue
@@ -5,7 +5,7 @@ import 'aos/dist/aos.css'
 
 onMounted(() => {
   AOS.init({
-    duration: 1200,
+    duration: 800,
     offset: 120,
     easing: 'ease-out-cubic',
     once: true