'回到顶部按钮优化'

.gitignore

@@ -6,4 +6,5 @@ index.md
 node_modules/
 .idea/
 .DS_Store
-nul
+nul
+*/desktop.ini

CLAUDE.md

@@ -12,19 +12,32 @@ CJYDocs 是一个基于 Node.js + Express 的轻量级 Markdown 文档管理和
 
 ## 开发命令
 
-### 启动服务器
+### 本地开发
 ```bash
+npm install        # 安装依赖
 npm start          # 生产模式启动
 npm run dev        # 开发模式启动(使用 nodemon 自动重启)
 ```
 
 服务器默认运行在 `http://localhost:3000`
 
-### 安装依赖
+### Docker 部署
 ```bash
-npm install
+# 构建镜像
+docker build -t cjydocs:latest .
+
+# 运行容器（必须挂载 docs 和 index.md）
+docker run -d \
+  --name cjydocs \
+  -p 3000:3000 \
+  -v $(pwd)/docs:/app/docs \
+  -v $(pwd)/index.md:/app/index.md \
+  --restart unless-stopped \
+  cjydocs:latest
 ```
 
+**重要**: Docker 镜像不包含文档数据,必须挂载 `docs/` 和 `index.md`,否则容器无法正常工作。
+
 ## 核心架构
 
 ### 三层架构
@@ -180,16 +193,20 @@ cjydocs/
 ├── docs/
 │   └── 分类名/
 │       └── 文档.md        # 实际文档内容(可通过在线编辑修改)
-└── public/
-    ├── index.html         # 首页(显示分类列表)35行
-    ├── reader.html        # 阅读器页面(三栏布局+编辑器)129行
-    ├── css/style.css      # 统一样式
-    └── js/
-        ├── index.js       # 首页逻辑(70行)
-        └── reader.js      # 阅读器核心逻辑(1113行)
-                           # - DOM缓存、事件委托
-                           # - 搜索、TOC、侧边栏交互
-                           # - 在线编辑器(智能光标定位)
+├── public/
+│   ├── index.html         # 首页(显示分类列表)35行
+│   ├── reader.html        # 阅读器页面(三栏布局+编辑器)129行
+│   ├── css/style.css      # 统一样式
+│   └── js/
+│       ├── index.js       # 首页逻辑(70行)
+│       └── reader.js      # 阅读器核心逻辑(1113行)
+│                          # - DOM缓存、事件委托
+│                          # - 搜索、TOC、侧边栏交互
+│                          # - 在线编辑器(智能光标定位)
+├── Dockerfile             # Docker 镜像构建文件
+├── DOCKER.md              # Docker 部署详细文档
+├── CLAUDE.md              # Claude Code 项目指南
+└── README.md              # 项目说明文档
 ```
 
 ## 代码修改指南

Dockerfile

@@ -8,8 +8,6 @@ RUN npm ci --only=production
 
 COPY server.js ./
 COPY public ./public
-COPY index.md ./
-COPY docs ./docs
 
 EXPOSE 3000
 

README.md

@@ -815,8 +815,11 @@ if (!Array.isArray(structure) || structure.length === 0) {
 
 ```
 cjydocs/
+├── server.js                    # Express 服务器 (5KB)
+├── index.md                     # 文档结构配置文件（项目根目录）
+├── package.json                 # 项目依赖
+│
 ├── docs/                        # 文档存储目录
-│   ├── index.md                 # 文档结构配置文件
 │   ├── 分类1/
 │   │   ├── 文档A.md
 │   │   └── 文档B.md
@@ -832,8 +835,9 @@ cjydocs/
 │   ├── index.html              # 首页
 │   └── reader.html             # 阅读器页面
 │
-├── server.js                    # Express 服务器 (5KB)
-├── package.json                 # 项目依赖
+├── Dockerfile                   # Docker 镜像构建文件
+├── DOCKER.md                    # Docker 部署详细文档
+├── CLAUDE.md                    # Claude Code 项目指南
 └── README.md                    # 本文档
 ```
 
@@ -841,13 +845,15 @@ cjydocs/
 
 ## 🚀 快速开始
 
-### 安装依赖
+### 方式一：直接运行
+
+#### 安装依赖
 
 ```bash
 npm install
 ```
 
-### 启动服务器
+#### 启动服务器
 
 ```bash
 npm start
@@ -857,6 +863,26 @@ node server.js
 
 服务器将运行在 `http://localhost:3000`
 
+### 方式二：Docker 部署
+
+#### 构建并运行
+
+```bash
+# 构建镜像
+docker build -t cjydocs:latest .
+
+# 运行容器（必须挂载 docs 和 index.md）
+docker run -d \
+  --name cjydocs \
+  -p 3000:3000 \
+  -v $(pwd)/docs:/app/docs \
+  -v $(pwd)/index.md:/app/index.md \
+  --restart unless-stopped \
+  cjydocs:latest
+```
+
+**注意**：Docker 镜像不包含文档数据，必须挂载 `docs/` 目录和 `index.md` 文件。
+
 ### 配置文档
 
 编辑 `docs/index.md` 定义文档结构：

public/css/style.css

@@ -1060,9 +1060,9 @@ body {
     align-items: center;
     justify-content: center;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-    opacity: 0.3;
+    opacity: 0.35;
     transition: all 0.3s ease;
-    z-index: 99;
+    z-index: 1002;
     outline: none;
 }
 
@@ -1243,7 +1243,12 @@ body {
     .floating-action-btn {
         width: 45px !important;
         height: 45px !important;
-        z-index: 98 !important;
+        z-index: 1002 !important;
+        opacity: 0.45 !important;
+    }
+
+    .floating-action-btn:hover {
+        opacity: 1 !important;
     }
 
     .back-to-top {

public/js/desktop.ini

@@ -0,0 +1,2 @@
+[LocalizedFileNames]
+marked.min.js=@marked.min.js,0

public/js/reader.js

@@ -787,33 +787,42 @@ function scrollToSearchMatch(fullLine) {
 // 设置回到顶部按钮
 function setupBackToTop() {
     const backToTopBtn = document.getElementById('back-to-top');
-    const contentArea = document.getElementById('content-area');
 
-    if (!backToTopBtn || !contentArea) return;
+    if (!backToTopBtn) return;
 
     // 初始状态：隐藏按钮
     backToTopBtn.classList.add('hidden');
 
     // 点击按钮滚动到顶部
-    backToTopBtn.addEventListener('click', () => {
-        contentArea.scrollTo({
+    backToTopBtn.addEventListener('click', (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+
+        // 滚动到顶部
+        window.scrollTo({
             top: 0,
             behavior: 'smooth'
         });
     });
 
-    // 监听滚动事件，控制按钮显示/隐藏
+    // 监听窗口滚动事件，根据滚动位置控制按钮显示/隐藏
     let scrollTimeout;
-    contentArea.addEventListener('scroll', () => {
+
+    const handleScroll = () => {
         clearTimeout(scrollTimeout);
         scrollTimeout = setTimeout(() => {
-            if (contentArea.scrollTop > 300) {
+            const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+
+            // 滚动超过 300px 时显示按钮
+            if (scrollTop > 300) {
                 backToTopBtn.classList.remove('hidden');
             } else {
                 backToTopBtn.classList.add('hidden');
             }
         }, 100);
-    });
+    };
+
+    window.addEventListener('scroll', handleScroll);
 }
 
 // 编辑功能

public/reader.html

@@ -9,7 +9,7 @@
     <script src="/js/marked.min.js"></script>
     <!-- Highlight.js - 代码高亮 -->
     <link rel="stylesheet" href="/css/github.min.css">
-    <script src="/js/highlight.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/highlight.js"></script>
 </head>
 <body>
     <div class="reader-container">