jianzhihuixiang/alacarte-novel-website/chapters/chapter-37.html

929 lines
38 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<title>暗影迷宫·影子剑士 - 阿拉德:剑之回响</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
<style>
:root {
--bg-primary: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%);
--text-primary: #e0e0e0;
--text-secondary: #888;
--accent-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
--border-color: rgba(255,255,255,0.1);
--btn-bg: rgba(255,255,255,0.1);
--btn-hover: rgba(255,255,255,0.2);
}
[data-theme="light"] {
--bg-primary: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
--text-primary: #333;
--text-secondary: #666;
--border-color: rgba(0,0,0,0.1);
--btn-bg: rgba(0,0,0,0.05);
--btn-hover: rgba(0,0,0,0.1);
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Noto Serif SC', serif;
background: var(--bg-primary);
color: var(--text-primary);
line-height: 1.8;
min-height: 100vh;
transition: all 0.3s ease;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
padding-bottom: 120px;
}
/* 顶部导航 */
.top-nav {
position: fixed;
top: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.3);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--border-color);
z-index: 1000;
padding: 10px 20px;
}
.top-nav-content {
max-width: 800px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.nav-link {
color: var(--text-primary);
text-decoration: none;
font-family: 'Noto Sans SC', sans-serif;
font-size: 14px;
padding: 8px 16px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
border-radius: 8px;
transition: all 0.3s ease;
}
.nav-link:hover {
background: var(--btn-hover);
}
.chapter-header {
text-align: center;
padding: 80px 0 40px;
border-bottom: 1px solid var(--border-color);
margin-bottom: 40px;
}
.chapter-number {
font-size: 14px;
color: var(--text-secondary);
letter-spacing: 4px;
text-transform: uppercase;
margin-bottom: 10px;
}
.chapter-title {
font-size: 32px;
font-weight: 700;
background: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: 20px;
}
.chapter-meta {
font-size: 14px;
color: var(--text-secondary);
}
.chapter-content {
font-size: 18px;
line-height: 2;
text-align: justify;
}
.chapter-content p {
margin-bottom: 1.5em;
text-indent: 2em;
}
.chapter-content p:first-of-type::first-letter {
font-size: 3em;
float: left;
line-height: 1;
margin-right: 8px;
margin-top: -5px;
background: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
font-weight: 700;
}
/* 固定底部导航 */
.fixed-nav {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.3);
backdrop-filter: blur(10px);
border-top: 1px solid var(--border-color);
z-index: 1000;
padding: 15px 20px;
}
.fixed-nav-content {
max-width: 800px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.nav-btn {
padding: 12px 24px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
border-radius: 8px;
color: var(--text-primary);
text-decoration: none;
transition: all 0.3s ease;
font-family: 'Noto Sans SC', sans-serif;
font-size: 14px;
cursor: pointer;
}
.nav-btn:hover {
background: var(--btn-hover);
transform: translateY(-2px);
}
.nav-btn.disabled {
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
/* 右侧滚动按钮 */
.scroll-buttons {
position: fixed;
right: 20px;
bottom: 90px;
display: flex;
flex-direction: column;
gap: 10px;
z-index: 1001;
}
.scroll-btn {
width: 40px;
height: 40px;
border-radius: 8px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
color: var(--text-primary);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
transition: all 0.3s ease;
font-family: 'Noto Sans SC', sans-serif;
}
.scroll-btn:hover {
background: var(--btn-hover);
}
/* TTS控制面板 */
.tts-panel {
position: fixed;
left: 20px;
bottom: 90px;
display: flex;
flex-direction: column;
gap: 10px;
z-index: 1002;
background: rgba(0,0,0,0.6);
backdrop-filter: blur(10px);
border-radius: 12px;
border: 1px solid var(--border-color);
padding: 15px;
min-width: 180px;
}
.tts-title {
font-size: 12px;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 5px;
}
.tts-controls {
display: flex;
gap: 8px;
margin-bottom: 10px;
}
.tts-btn {
width: 36px;
height: 36px;
border-radius: 8px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
color: var(--text-primary);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
transition: all 0.3s ease;
font-family: 'Noto Sans SC', sans-serif;
}
.tts-btn:hover {
background: var(--btn-hover);
}
.tts-btn.active {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-color: #667eea;
}
.tts-progress {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 10px;
}
.tts-progress-bar {
flex: 1;
height: 4px;
background: var(--btn-bg);
border-radius: 2px;
overflow: hidden;
}
.tts-progress-fill {
height: 100%;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
width: 0%;
transition: width 0.1s ease;
}
.tts-time {
font-size: 12px;
color: var(--text-secondary);
font-family: 'Noto Sans SC', sans-serif;
min-width: 80px;
}
.tts-speed {
display: flex;
align-items: center;
gap: 8px;
}
.tts-speed-label {
font-size: 12px;
color: var(--text-secondary);
font-family: 'Noto Sans SC', sans-serif;
}
.tts-speed-select {
padding: 4px 8px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
border-radius: 4px;
color: var(--text-primary);
font-size: 12px;
cursor: pointer;
font-family: 'Noto Sans SC', sans-serif;
}
@media (max-width: 600px) {
.tts-panel {
left: 10px;
right: 10px;
bottom: auto;
top: 60px;
min-width: auto;
padding: 12px;
width: auto;
z-index: 1003;
}
.tts-btn {
width: 32px;
height: 32px;
font-size: 12px;
}
.tts-title {
font-size: 11px;
}
.tts-speed-label {
font-size: 11px;
}
.tts-speed-select {
padding: 3px 6px;
font-size: 11px;
}
.tts-time {
font-size: 11px;
min-width: 60px;
}
/* 手机端隐藏滚动按钮给TTS腾空间 */
.scroll-buttons {
display: none;
}
}
@media (max-width: 400px) {
.tts-panel {
top: 55px;
padding: 10px;
}
.tts-controls {
gap: 6px;
}
.tts-btn {
width: 28px;
height: 28px;
font-size: 11px;
}
}
/* 侧边栏 - 标题固定,内容滚动 */
.sidebar {
position: fixed;
right: 20px;
top: 50%;
transform: translateY(-50%);
background: rgba(0,0,0,0.5);
backdrop-filter: blur(10px);
border-radius: 12px;
border: 1px solid var(--border-color);
width: 200px;
max-height: 70vh;
z-index: 999;
display: flex;
flex-direction: column;
}
.sidebar-title {
font-size: 14px;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 2px;
padding: 15px 20px;
border-bottom: 1px solid var(--border-color);
flex-shrink: 0;
}
.sidebar-content {
overflow-y: auto;
padding: 10px 20px 20px;
flex: 1;
scrollbar-width: thin;
scrollbar-color: transparent transparent;
transition: scrollbar-color 0.3s ease;
}
.sidebar-content:hover {
scrollbar-color: rgba(255,255,255,0.3) transparent;
}
.sidebar-content::-webkit-scrollbar {
width: 6px;
}
.sidebar-content::-webkit-scrollbar-track {
background: transparent;
}
.sidebar-content::-webkit-scrollbar-thumb {
background: transparent;
border-radius: 3px;
transition: background 0.3s ease;
}
.sidebar-content:hover::-webkit-scrollbar-thumb {
background: rgba(255,255,255,0.3);
}
.sidebar-content:hover::-webkit-scrollbar-thumb:hover {
background: rgba(255,255,255,0.5);
}
[data-theme="light"] .sidebar-content:hover {
scrollbar-color: rgba(0,0,0,0.3) transparent;
}
[data-theme="light"] .sidebar-content:hover::-webkit-scrollbar-thumb {
background: rgba(0,0,0,0.3);
}
[data-theme="light"] .sidebar-content:hover::-webkit-scrollbar-thumb:hover {
background: rgba(0,0,0,0.5);
}
.sidebar-chapter {
display: block;
padding: 8px 0;
color: #aaa;
text-decoration: none;
font-size: 13px;
border-bottom: 1px solid rgba(255,255,255,0.05);
transition: all 0.3s ease;
line-height: 1.5;
}
.sidebar-chapter:hover {
color: #667eea;
}
.sidebar-chapter.current {
color: #667eea;
font-weight: 600;
}
@media (max-width: 1200px) {
.sidebar {
display: none;
}
}
@media (max-width: 600px) {
.chapter-title {
font-size: 24px;
}
.chapter-content {
font-size: 16px;
}
.fixed-nav-content {
gap: 10px;
}
.nav-btn {
padding: 10px 15px;
font-size: 12px;
}
.scroll-buttons {
right: 10px;
bottom: 80px;
}
.scroll-btn {
width: 36px;
height: 36px;
}
}
/* 滚动条样式 */
.sidebar::-webkit-scrollbar {
width: 4px;
}
.sidebar::-webkit-scrollbar-track {
background: transparent;
}
.sidebar::-webkit-scrollbar-thumb {
background: rgba(255,255,255,0.2);
border-radius: 2px;
}
</style>
</head>
<body>
<!-- 顶部导航 -->
<nav class="top-nav">
<div class="top-nav-content">
<a href="../index.html" class="nav-link">返回首页</a>
<button class="nav-link" id="themeToggle">切换主题</button>
</div>
</nav>
<div class="container">
<header class="chapter-header">
<div class="chapter-number">Chapter 37</div>
<h1 class="chapter-title">{{CHAPTER_TITLE}}</h1>
</header>
<article class="chapter-content">
<p>在西海岸休整两日后,林克一行人收到了克伦特的紧急传讯。</p>
<p>"暗影迷宫出现异常。"传讯卷轴上只有简短的一句话,但林克能感受到其中的凝重。</p>
<p>暗影迷宫位于暗黑城深处,是暗精灵王国的禁地。传说中,那里关押着暗精灵历史上最危险的罪犯,也是暗精灵最强剑士——影子剑士刹影的沉眠之地。</p>
<p>"刹影..."莎兰听到这个名字时,眉头微微皱起,"我听说过他。百年前的暗精灵第一剑士,为了追求极致的剑道,自愿拥抱暗影之力。"</p>
<p>"他现在是什么状态?"林克问道。</p>
<p>"不生不死。"莎兰轻声道,"他成为暗影的奴隶,永远在迷宫中徘徊,击败所有进入其中的挑战者。"</p>
<p>赛丽亚握紧了林克的手:"我们要去吗?"</p>
<p>"必须去。"林克看向窗外,"如果暗影迷宫失控,整个暗黑城都会受到威胁。"</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
<p>一天后,四人再次抵达阿法利亚营地。</p>
<p>克伦特的脸色比上次见面时更加凝重:"情况比想象的更严重。暗影迷宫的封印正在衰弱,刹影的暗影之力正在外泄。已经有几支探险队进入迷宫...没有一个人出来。"</p>
<p>"让我们去吧。"林克握紧晨曦,"我们对付过邪龙,也能对付一个剑士。"</p>
<p>克伦特点点头,将一把古老的钥匙交给林克:"这是进入迷宫深处的钥匙。记住,刹影最可怕的不是他的剑术,而是他的暗影之力。光...是你们唯一的优势。"</p>
<p>艾伦上前一步:"我的圣光,正是暗影的克星。"</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
<p>暗影迷宫的入口隐藏在暗黑城最深处的地下。</p>
<p>当四人踏入迷宫的瞬间,一股阴冷的气息扑面而来。这里不像暗精灵墓地那样有明确的通道,而是布满了错综复杂的岔路和死胡同。墙壁上燃烧着幽蓝色的火焰,将一切都笼罩在诡异的光影中。</p>
<p>"跟紧我。"林克举起晨曦,金色的光芒驱散了一部分黑暗,"这里的暗影会吞噬迷失的人。"</p>
<p>他们小心翼翼地前进,但迷宫仿佛有生命一般,通道在不断变化。刚走过的路,转眼间就变成了死胡同。</p>
<p>"这是暗影幻术。"艾伦释放圣光,试图看破幻象,"大家不要被眼睛欺骗,相信感知。"</p>
<p>在艾伦的圣光指引下,四人终于找到了通往迷宫深处的正确道路。但就在他们即将抵达核心区域时,一道黑色的身影突然从阴影中闪现!</p>
<p>"又有送死的来了..."沙哑的声音在迷宫中回荡。</p>
<p>那是一个身穿黑色铠甲的暗精灵,周身缠绕着浓郁的黑色雾气。他的眼睛完全是漆黑的,没有一丝眼白,手中握着一柄漆黑如墨的太刀。</p>
<p>影子剑士刹影。</p>
<p>"你就是刹影?"林克举起晨曦,金色光芒与黑色雾气激烈碰撞。</p>
<p>刹影缓缓抬起头,漆黑的眼眸盯着林克:"一个剑士...用的是光剑...有趣。"</p>
<p>他猛然拔刀,一道黑色剑气呼啸而出!</p>
<p>"暗影斩!"</p>
<p>林克侧身闪避,黑色剑气擦着他的衣角掠过,在地面上留下一道深深的裂痕。那裂痕边缘还在冒着黑烟,显然附带腐蚀效果。</p>
<p>"反应不错。"刹影的声音中带着一丝赞赏,"但...这只是开始。"</p>
<p>他的身形突然模糊,然后分化出五个一模一样的影子!六个刹影从不同的方向同时攻来,每一个都散发着真实的杀意。</p>
<p>"影分身?!"奥菲利亚惊呼。</p>
<p>"不,那些都是实体!"赛丽亚大喊,"林克,小心!"</p>
<p>林克闭上眼睛,将意识完全沉浸在晨曦之中。晨曦的光芒越来越强烈,最后化作一道金色的光环向四周扩散!</p>
<p>"光之领域!"</p>
<p>金色光环所过之处,暗影如同冰雪般消融。五个影子分身发出凄厉的惨叫,瞬间崩溃!</p>
<p>"什么?!"刹影的真身被迫现身,脸上第一次出现了惊讶的表情,"光属性...难道你是..."</p>
<p>他没有说完,而是再次发动攻击。这一次,他的速度快到了极致,整个人化作一道黑色闪电,瞬间出现在林克身后!</p>
<p>"暗影突袭!"</p>
<p>林克只来得及侧身,太刀擦着他的肩膀划过,留下一道血痕。</p>
<p>"好快..."林克咬牙,这个速度比斯扎克还要快!</p>
<p>"林克,用圣光牵制他!"艾伦高举十字架,一道金色光柱从天而降,将刹影笼罩!</p>
<p>刹影发出痛苦的嘶吼,圣光对他的暗影之躯造成了巨大伤害。他拼命挣扎,想要逃离光柱的笼罩。</p>
<p>"就是现在!"林克抓住机会,破极兵刃全程开启,金色剑光如同流星般斩向刹影!</p>
<p>里·鬼剑术!</p>
<p>铛铛铛——!!</p>
<p>晨曦与太刀激烈碰撞,火花四溅。刹影的剑术确实精湛,即使在圣光的压制下,依然能精准格挡林克的攻击。</p>
<p>"不错的剑术..."刹影一边格挡一边说道,"但...还不够!"</p>
<p>他突然放弃防御,任由晨曦斩在他的铠甲上,同时太刀直刺林克的胸口!</p>
<p>"以伤换命?!"林克大惊,连忙后退。</p>
<p>但太刀还是划开了他的铠甲,在胸口留下一道血痕。而刹影的铠甲虽然被晨曦斩出一道裂痕,但暗影之力正在快速修复。</p>
<p>"在暗影迷宫中...我是不死的..."刹影狂笑,"你们...永远别想击败我!"</p>
<p>他张开双臂,整个迷宫的暗影之力向他汇聚。黑色的雾气越来越浓郁,最后形成了一个巨大的暗影漩涡!</p>
<p>"暗影领域·死亡切割!"</p>
<p>无数黑色剑气从漩涡中射出,覆盖了整片区域!</p>
<p>"快防御!"艾伦全力催动圣光,在四人周围形成了一道金色屏障。</p>
<p>黑色剑气撞在屏障上,发出刺耳的摩擦声。艾伦的脸色越来越苍白,显然支撑不了多久。</p>
<p>"必须打破他的领域!"林克咬牙。</p>
<p>他看向晨曦,心中做出了决定。</p>
<p>"晨曦...拜托了...把全部力量借给我!"</p>
<p>晨曦发出一声清越的剑鸣,金色的光芒暴涨!龙纹完全亮起,远古龙族的力量再次觉醒!</p>
<p>"猛龙断空斩·极!"</p>
<p>金色巨龙咆哮着冲向暗影漩涡,光与暗激烈碰撞!</p>
<p>刹影发出凄厉的惨叫,他的暗影领域在龙形剑气的冲击下开始出现裂痕!</p>
<p>"不可能...我的暗影...我的力量..."</p>
<p>林克没有给他喘息的机会,趁着领域破裂的瞬间,冲到刹影面前!</p>
<p>"结束了!"</p>
<p>晨曦穿透了刹影的胸口,金色的光芒从他体内爆发,将暗影之力彻底净化!</p>
<p>刹影的身体开始崩溃,黑色的雾气逐渐消散。在生命的最后一刻,他漆黑的眼眸中恢复了一丝清明。</p>
<p>"谢谢...你..."他轻声说,"终于...解脱了..."</p>
<p>他的身体化作无数光点,消散在空气中。</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
<p>战斗结束,林克跪倒在地,大口喘着气。</p>
<p>这一战比邪龙斯皮兹还要凶险。刹影的剑术精湛,暗影之力诡异,如果不是晨曦的龙之力,他们很可能会全军覆没。</p>
<p>"林克!"赛丽亚和奥菲利亚跑上来,一左一右扶住他。</p>
<p>"我没事..."林克勉强笑了笑,"只是...有点累..."</p>
<p>艾伦也走了过来,脸色苍白但带着欣慰的笑容:"你的剑术...又进步了。"</p>
<p>林克看向刹影消失的地方,心中五味杂陈。</p>
<p>那位追求极致剑道的剑士,最终解脱了暗影的束缚。也许...这就是他一直在等待的结局。</p>
<p>"走吧。"林克站起身,"迷宫的危机解除了。"</p>
<p>四人沿着来时的路返回,幽蓝色的火焰渐渐熄灭,暗影迷宫重新恢复了平静。</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0; margin-top: 2em;">(第三十七章完)</p>
</article>
</div>
<!-- 固定底部导航 -->
<nav class="fixed-nav">
<div class="fixed-nav-content">
<a href="chapter-36.html" class="nav-btn ">上一章</a>
<a href="../chapters.html" class="nav-btn">目录</a>
<a href="chapter-38.html" class="nav-btn ">下一章</a>
</div>
</nav>
<!-- 右侧滚动按钮 -->
<div class="scroll-buttons">
<button class="scroll-btn" id="scrollTop" title="回到顶部"></button>
<button class="scroll-btn" id="scrollBottom" title="回到底部"></button>
</div>
<!-- TTS语音朗读面板 -->
<div class="tts-panel" id="ttsPanel">
<div class="tts-title">语音朗读</div>
<div class="tts-controls">
<button class="tts-btn" id="ttsPlay" title="播放"></button>
<button class="tts-btn" id="ttsPause" title="暂停"></button>
<button class="tts-btn" id="ttsStop" title="停止"></button>
</div>
<div class="tts-progress">
<div class="tts-progress-bar">
<div class="tts-progress-fill" id="ttsProgressFill"></div>
</div>
<div class="tts-time" id="ttsTime">0 / 0</div>
</div>
<div class="tts-speed">
<span class="tts-speed-label">速度:</span>
<select class="tts-speed-select" id="ttsSpeed">
<option value="0.5">慢速</option>
<option value="0.75">较慢</option>
<option value="1" selected>正常</option>
<option value="1.25">较快</option>
<option value="1.5">快速</option>
<option value="2">极速</option>
</select>
</div>
</div>
<!-- 侧边栏章节导航 -->
<aside class="sidebar">
<div class="sidebar-title">章节导航</div>
<div class="sidebar-content" id="sidebarContent">
<a href="chapter-7.html" class="sidebar-chapter ">第7章烈焰格拉卡</a>
<a href="chapter-8.html" class="sidebar-chapter ">第8章冰霜幽暗密林</a>
<a href="chapter-9.html" class="sidebar-chapter ">第9章转职之路</a>
<a href="chapter-10.html" class="sidebar-chapter ">第10章暗黑雷鸣废墟</a>
<a href="chapter-11.html" class="sidebar-chapter ">第11章剑魂转职仪式</a>
<a href="chapter-12.html" class="sidebar-chapter ">第12章西海岸</a>
<a href="chapter-13.html" class="sidebar-chapter ">第13章龙人之塔</a>
<a href="chapter-14.html" class="sidebar-chapter ">第14章人偶玄关</a>
<a href="chapter-15.html" class="sidebar-chapter ">第15章石巨人塔</a>
<a href="chapter-16.html" class="sidebar-chapter ">第16章黑暗玄廊</a>
<a href="chapter-17.html" class="sidebar-chapter ">第17章城主宫殿</a>
<a href="chapter-18.html" class="sidebar-chapter ">第18章番外·悬空城</a>
<a href="chapter-19.html" class="sidebar-chapter ">第19章天帷巨兽·神殿外围</a>
<a href="chapter-20.html" class="sidebar-chapter ">第20章树精丛林</a>
<a href="chapter-21.html" class="sidebar-chapter ">第21章炼狱</a>
<a href="chapter-22.html" class="sidebar-chapter ">第22章西海岸的闲暇</a>
<a href="chapter-23.html" class="sidebar-chapter ">第23章极昼</a>
<a href="chapter-24.html" class="sidebar-chapter ">第24章第一脊椎</a>
<a href="chapter-25.html" class="sidebar-chapter ">第25章赫顿玛尔的准备</a>
<a href="chapter-26.html" class="sidebar-chapter ">第26章第二脊椎</a>
<a href="chapter-27.html" class="sidebar-chapter ">第27章重逢的温柔</a>
<a href="chapter-28.html" class="sidebar-chapter ">第28章暗精灵的委托</a>
<a href="chapter-29.html" class="sidebar-chapter ">第29章阿法利亚营地</a>
<a href="chapter-30.html" class="sidebar-chapter ">第30章浅栖之地</a>
<a href="chapter-31.html" class="sidebar-chapter ">第31章蜘蛛洞穴</a>
<a href="chapter-32.html" class="sidebar-chapter ">第32章克伦特的委托</a>
<a href="chapter-33.html" class="sidebar-chapter ">第33章暗精灵墓地·左翼守卫</a>
<a href="chapter-34.html" class="sidebar-chapter ">第34章暗精灵墓地·剩余三将军</a>
<a href="chapter-35.html" class="sidebar-chapter ">第35章邪龙斯皮兹</a>
<a href="chapter-36.html" class="sidebar-chapter ">第36章莎兰的探望</a>
<a href="chapter-37.html" class="sidebar-chapter current">第37章暗影迷宫·影子剑士</a>
<a href="chapter-38.html" class="sidebar-chapter ">第38章熔岩穴·泰坦之怒</a>
<a href="chapter-39.html" class="sidebar-chapter ">第39章暗黑城入口·无头骑士</a>
<a href="chapter-40.html" class="sidebar-chapter ">第40章万年雪山·冰心少年</a>
<a href="chapter-41.html" class="sidebar-chapter ">第41章敏泰的加入</a>
<a href="chapter-42.html" class="sidebar-chapter ">第42章山脊·野兽师</a>
<a href="chapter-43.html" class="sidebar-chapter ">第43章番外·雪山温泉</a>
<a href="chapter-44.html" class="sidebar-chapter ">第44章白色废墟</a>
<a href="chapter-45.html" class="sidebar-chapter ">第45章冰雪宫殿</a>
<a href="chapter-46.html" class="sidebar-chapter ">第46章布万加修炼场</a>
<a href="chapter-47.html" class="sidebar-chapter ">第47章斯卡萨之巢·龙威</a>
<a href="chapter-48.html" class="sidebar-chapter ">第48章斯卡萨之巢·龙陨</a>
<a href="chapter-49.html" class="sidebar-chapter ">第49章重返赫顿玛尔</a>
<a href="chapter-50.html" class="sidebar-chapter ">第50章诺斯玛尔·盗贼团</a>
<a href="chapter-51.html" class="sidebar-chapter ">第51章哈穆林·鼠患</a>
<a href="chapter-52.html" class="sidebar-chapter ">第52章月光酒馆·寻找阿甘左</a>
<a href="chapter-53.html" class="sidebar-chapter ">第53章番外·帕丽丝的誓言</a>
<a href="chapter-54.html" class="sidebar-chapter ">第54章觉醒之路·启程</a>
<a href="chapter-55.html" class="sidebar-chapter ">第55章比尔马克帝国试验场</a>
<a href="chapter-56.html" class="sidebar-chapter ">第56章王的遗迹·远古五骑士</a>
<a href="chapter-57.html" class="sidebar-chapter ">第57章心灵试炼·剑圣觉醒</a>
<a href="chapter-58.html" class="sidebar-chapter ">第58章番外·后宫的温馨</a>
<a href="chapter-59.html" class="sidebar-chapter ">第59章敏泰的思念</a>
<a href="chapter-60.html" class="sidebar-chapter ">第60章敏泰加入·前往诺伊佩拉</a>
<a href="chapter-61.html" class="sidebar-chapter ">第61章悲鸣洞穴·阿甘左与卢克西</a>
<a href="chapter-62.html" class="sidebar-chapter ">第62章战前准备·痛苦之村的情报</a>
<a href="chapter-63.html" class="sidebar-chapter ">第63章痛苦之村列瑟芬·狄瑞吉的真身</a>
<a href="chapter-64.html" class="sidebar-chapter ">第64章胜利归来·赫顿玛尔的庆祝</a>
<a href="chapter-65.html" class="sidebar-chapter ">第65章正宫的专属时光·赛丽亚的深情</a>
<a href="chapter-66.html" class="sidebar-chapter ">第66章番外·五人同床·后宫大被同眠</a>
<a href="chapter-67.html" class="sidebar-chapter ">第67章热血八番街·火箭侠的阴谋</a>
</div>
</aside>
<script>
// 记录阅读进度
let readChapters = JSON.parse(localStorage.getItem('readChapters') || '[]');
if (!readChapters.includes(37)) {
readChapters.push({{CHAPTER_ID}});
localStorage.setItem('readChapters', JSON.stringify(readChapters));
}
// 主题切换
const themeToggle = document.getElementById('themeToggle');
const savedTheme = localStorage.getItem('theme') || 'dark';
document.documentElement.setAttribute('data-theme', savedTheme);
themeToggle.textContent = savedTheme === 'dark' ? '浅色' : '深色';
themeToggle.addEventListener('click', () => {
const currentTheme = document.documentElement.getAttribute('data-theme');
const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('theme', newTheme);
themeToggle.textContent = newTheme === 'dark' ? '浅色' : '深色';
});
// 滚动到顶部
document.getElementById('scrollTop').addEventListener('click', () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
// 滚动到底部
document.getElementById('scrollBottom').addEventListener('click', () => {
window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });
});
// 页面加载时,侧边栏自动滚动到当前章节
window.addEventListener('load', () => {
const sidebarContent = document.getElementById('sidebarContent');
const currentChapter = sidebarContent.querySelector('.current');
if (currentChapter) {
currentChapter.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
});
// ========== TTS语音朗读功能 ==========
let ttsSynth = window.speechSynthesis;
let ttsUtterance = null;
let ttsText = '';
let ttsSentences = [];
let ttsCurrentIndex = 0;
let ttsIsPlaying = false;
let ttsIsPaused = false;
let ttsSpeed = 1;
// 初始化:提取章节内容
function initTTS() {
const contentEl = document.querySelector('.chapter-content');
if (!contentEl) return;
// 获取所有段落文本清理HTML标签
ttsText = contentEl.innerText || contentEl.textContent;
// 分割成句子(中文按句号、问号、感叹号分割)
ttsSentences = ttsText.match(/[^。!?\n]+[。!?\n]+|[^。!?\n]+$/g) || [ttsText];
ttsSentences = ttsSentences.filter(s => s.trim().length > 0);
updateTTSProgress();
}
// 更新进度显示
function updateTTSProgress() {
const total = ttsSentences.length;
const current = ttsCurrentIndex;
document.getElementById('ttsTime').textContent = `${current} / ${total}`;
const percent = total > 0 ? (current / total * 100) : 0;
document.getElementById('ttsProgressFill').style.width = `${percent}%`;
}
// 播放当前句子
function playCurrentSentence() {
if (ttsCurrentIndex >= ttsSentences.length) {
stopTTS();
return;
}
const text = ttsSentences[ttsCurrentIndex].trim();
ttsUtterance = new SpeechSynthesisUtterance(text);
ttsUtterance.lang = 'zh-CN';
ttsUtterance.rate = ttsSpeed;
// 尝试选择中文语音
const voices = ttsSynth.getVoices();
const zhVoice = voices.find(v => v.lang.includes('zh') || v.lang.includes('CN'));
if (zhVoice) {
ttsUtterance.voice = zhVoice;
}
ttsUtterance.onend = () => {
if (ttsIsPlaying && !ttsIsPaused) {
ttsCurrentIndex++;
updateTTSProgress();
playCurrentSentence();
}
};
ttsUtterance.onerror = (e) => {
console.error('TTS error:', e);
if (ttsIsPlaying) {
ttsCurrentIndex++;
updateTTSProgress();
playCurrentSentence();
}
};
ttsSynth.speak(ttsUtterance);
}
// 播放
function playTTS() {
if (ttsSentences.length === 0) {
initTTS();
}
if (ttsIsPaused) {
ttsSynth.resume();
ttsIsPaused = false;
} else {
ttsIsPlaying = true;
playCurrentSentence();
}
document.getElementById('ttsPlay').classList.add('active');
document.getElementById('ttsPause').classList.remove('active');
}
// 暂停
function pauseTTS() {
if (ttsIsPlaying) {
ttsSynth.pause();
ttsIsPaused = true;
document.getElementById('ttsPlay').classList.remove('active');
document.getElementById('ttsPause').classList.add('active');
}
}
// 停止
function stopTTS() {
ttsSynth.cancel();
ttsIsPlaying = false;
ttsIsPaused = false;
ttsCurrentIndex = 0;
updateTTSProgress();
document.getElementById('ttsPlay').classList.remove('active');
document.getElementById('ttsPause').classList.remove('active');
}
// 设置速度
function setTTSSpeed(speed) {
ttsSpeed = parseFloat(speed);
// 如果正在播放,需要重新开始当前句子
if (ttsIsPlaying && !ttsIsPaused) {
ttsSynth.cancel();
playCurrentSentence();
}
}
// 绑定事件
document.getElementById('ttsPlay').addEventListener('click', playTTS);
document.getElementById('ttsPause').addEventListener('click', pauseTTS);
document.getElementById('ttsStop').addEventListener('click', stopTTS);
document.getElementById('ttsSpeed').addEventListener('change', (e) => setTTSSpeed(e.target.value));
// 加载语音列表(某些浏览器需要异步加载)
if (speechSynthesis.onvoiceschanged !== undefined) {
speechSynthesis.onvoiceschanged = initTTS;
}
// 页面加载时初始化
window.addEventListener('load', () => {
initTTS();
});
// 页面离开时停止播放
window.addEventListener('beforeunload', stopTTS);
</script>
</body>
</html>