diff --git a/app/src/assets/scss/_toolbar.scss b/app/src/assets/scss/_toolbar.scss
index 7c2b0ad88..ecedd3cff 100644
--- a/app/src/assets/scss/_toolbar.scss
+++ b/app/src/assets/scss/_toolbar.scss
@@ -6,6 +6,7 @@
     box-shadow: var(--b3-point-shadow);
     border-radius: 4px;
     display: flex;
+    transition: top .15s cubic-bezier(0, 0, .2, 1) 0ms;
 
     &__item {
       color: var(--b3-theme-on-surface);
diff --git a/app/src/protyle/scroll/event.ts b/app/src/protyle/scroll/event.ts
index bac11ad04..78a7984d8 100644
--- a/app/src/protyle/scroll/event.ts
+++ b/app/src/protyle/scroll/event.ts
@@ -6,7 +6,23 @@ import {showMessage} from "../../dialog/message";
 import {updateHotkeyTip} from "../util/compatibility";
 
 export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
-    element.addEventListener("scroll", () => {
+    let elementRect = element.getBoundingClientRect();
+    element.addEventListener("scroll", (event) => {
+        if (!protyle.toolbar.element.classList.contains("fn__none")) {
+            const initY = protyle.toolbar.element.getAttribute("data-inity").split(Constants.ZWSP);
+            const top = parseInt(initY[0]) + (parseInt(initY[1]) - element.scrollTop)
+            if (elementRect.width === 0) {
+                elementRect = element.getBoundingClientRect();
+            }
+            const toolbarHeight = 29;
+            if (top < elementRect.top - toolbarHeight || top > elementRect.bottom - toolbarHeight) {
+                protyle.toolbar.element.style.display = "none";
+            } else {
+                protyle.toolbar.element.style.top = top + "px";
+                protyle.toolbar.element.style.display = "";
+            }
+            return;
+        }
         if (!window.siyuan.dragElement) { // https://ld246.com/article/1649638389841
             hideElements(["gutter"], protyle);
         }
@@ -50,5 +66,9 @@ export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
             });
         }
         protyle.scroll.lastScrollTop = Math.max(element.scrollTop, 0);
+    }, {
+        capture: false,
+        passive: true,
+        once: false
     });
 };
diff --git a/app/src/protyle/toolbar/index.ts b/app/src/protyle/toolbar/index.ts
index e82b41abf..43e4f3ea6 100644
--- a/app/src/protyle/toolbar/index.ts
+++ b/app/src/protyle/toolbar/index.ts
@@ -115,7 +115,9 @@ export class Toolbar {
         }
         const rangePosition = getSelectionPosition(nodeElement, range);
         this.element.classList.remove("fn__none");
-        setPosition(this.element, rangePosition.left - 52, rangePosition.top - this.toolbarHeight - 4);
+        const y = rangePosition.top - this.toolbarHeight - 4
+        this.element.setAttribute("data-inity", y + Constants.ZWSP + protyle.contentElement.scrollTop.toString());
+        setPosition(this.element, rangePosition.left - 52, y);
         this.element.querySelectorAll(".protyle-toolbar__item--current").forEach(item => {
             item.classList.remove("protyle-toolbar__item--current");
         });
diff --git a/app/src/protyle/ui/hideElements.ts b/app/src/protyle/ui/hideElements.ts
index f7c7c5215..5139b18f7 100644
--- a/app/src/protyle/ui/hideElements.ts
+++ b/app/src/protyle/ui/hideElements.ts
@@ -23,6 +23,7 @@ export const hideElements = (panels: string[], protyle?: IProtyle) => {
     }
     if (protyle.toolbar && panels.includes("toolbar")) {
         protyle.toolbar.element.classList.add("fn__none");
+        protyle.toolbar.element.style.display  = "";
     }
     if (protyle.toolbar && panels.includes("util")) {
         const pinElement = protyle.toolbar.subElement.querySelector('[data-type="pin"]');
diff --git a/app/src/protyle/util/onGet.ts b/app/src/protyle/util/onGet.ts
index f8531d7ab..8df308641 100644
--- a/app/src/protyle/util/onGet.ts
+++ b/app/src/protyle/util/onGet.ts
@@ -121,6 +121,7 @@ const setHTML = (options: { content: string, action?: string[] }, protyle: IProt
             });
             protyle.contentElement.scrollTop = protyle.contentElement.scrollTop + (removeElement.getBoundingClientRect().top - lastRemoveTop);
             protyle.scroll.lastScrollTop = protyle.contentElement.scrollTop;
+            hideElements(["toolbar"], protyle);
         }
         protyle.wysiwyg.element.insertAdjacentHTML("beforeend", options.content);
     } else if (options.action.includes(Constants.CB_GET_BEFORE)) {
@@ -135,6 +136,7 @@ const setHTML = (options: { content: string, action?: string[] }, protyle: IProt
             protyle.wysiwyg.element.lastElementChild.getBoundingClientRect().top > window.innerHeight) {
                 protyle.wysiwyg.element.lastElementChild.remove();
             }
+            hideElements(["toolbar"], protyle);
         }
     } else {
         protyle.wysiwyg.element.innerHTML = options.content;