diff --git a/src/components/blogs/HomePage.vue b/src/components/blogs/HomePage.vue
index 2041601..bc25c9b 100644
--- a/src/components/blogs/HomePage.vue
+++ b/src/components/blogs/HomePage.vue
@@ -17,7 +17,7 @@
         </div>
         <a-button type="link" shape="circle" class="down_button" size="large" @click="downScroll">
             <template #icon>
-                <DownCircleOutlined style="font-size: 35px;color: aliceblue;" />
+                <DownCircleOutlined style="font-size: 35px;color: aliceblue;" spin/>
             </template>
         </a-button>
         <div>
@@ -92,17 +92,21 @@ const handleScroll = () => {
         show_menu.value = scrollOffset > halfViewportHeight;
     }
 };
-const downScroll = () => {
-    const scrollbar = document.querySelector('.simplebar-content-wrapper');
-    if (scrollbar) {
-        setTimeout(() => {
-            const scrollOffset = scrollbar.scrollTop;
-            const halfViewportHeight = scrollbar.clientHeight / 6;
-            scrollOffset==halfViewportHeight
-            console.log(scrollOffset)
-        }, 1500)
-    }
-}
+const downScroll = () => {  
+    const scrollbar = document.querySelector('.simplebar-content-wrapper');  
+    if (scrollbar) {  
+        const scrollTop = scrollbar.scrollTop;  
+          
+        const viewportHeight = scrollbar.clientHeight;  
+        const scrollDistance = viewportHeight - scrollTop-60;  
+          
+        setTimeout(() => {  
+            scrollbar.scrollBy({ top: scrollDistance, behavior: 'smooth' });  
+        }, 300); 
+    }  
+};  
+
+
 const items = ref<MenuProps['items']>([
     {
         key: 'home',