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

968 lines
40 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;
}
.nav-btn.active {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-color: #667eea;
}
/* 右侧滚动按钮 */
.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-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.5);
z-index: 2000;
display: none;
align-items: center;
justify-content: center;
}
.tts-overlay.show {
display: flex;
}
.tts-panel {
background: rgba(30,30,50,0.95);
backdrop-filter: blur(10px);
border-radius: 16px;
border: 1px solid var(--border-color);
padding: 24px;
width: 90%;
max-width: 400px;
box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
[data-theme="light"] .tts-panel {
background: rgba(255,255,255,0.95);
}
.tts-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid var(--border-color);
}
.tts-title {
font-size: 18px;
font-weight: 600;
color: var(--text-primary);
font-family: 'Noto Sans SC', sans-serif;
}
.tts-close {
width: 32px;
height: 32px;
border-radius: 50%;
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: 18px;
transition: all 0.3s ease;
}
.tts-close:hover {
background: var(--btn-hover);
}
.tts-controls {
display: flex;
justify-content: center;
gap: 16px;
margin-bottom: 20px;
}
.tts-btn {
width: 56px;
height: 56px;
border-radius: 50%;
background: var(--btn-bg);
border: 2px solid var(--border-color);
color: var(--text-primary);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
transition: all 0.3s ease;
font-family: 'Noto Sans SC', sans-serif;
}
.tts-btn:hover {
background: var(--btn-hover);
transform: scale(1.1);
}
.tts-btn.active {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-color: #667eea;
transform: scale(1.1);
}
.tts-progress {
margin-bottom: 20px;
}
.tts-progress-bar {
height: 6px;
background: var(--btn-bg);
border-radius: 3px;
overflow: hidden;
margin-bottom: 8px;
}
.tts-progress-fill {
height: 100%;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
width: 0%;
transition: width 0.1s ease;
}
.tts-time {
font-size: 13px;
color: var(--text-secondary);
font-family: 'Noto Sans SC', sans-serif;
text-align: center;
}
.tts-speed {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
}
.tts-speed-label {
font-size: 14px;
color: var(--text-secondary);
font-family: 'Noto Sans SC', sans-serif;
}
.tts-speed-select {
padding: 8px 16px;
background: var(--btn-bg);
border: 1px solid var(--border-color);
border-radius: 8px;
color: var(--text-primary);
font-size: 14px;
cursor: pointer;
font-family: 'Noto Sans SC', sans-serif;
}
/* 侧边栏 - 标题固定,内容滚动 */
.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: 8px;
}
.nav-btn {
padding: 10px 12px;
font-size: 12px;
}
.scroll-buttons {
display: none;
}
.tts-panel {
padding: 20px;
width: 95%;
}
.tts-btn {
width: 48px;
height: 48px;
font-size: 18px;
}
.tts-title {
font-size: 16px;
}
}
/* 滚动条样式 */
.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 52</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 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 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 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 style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
<p>在长三郎的尸体旁,他们发现了一些线索。</p>
<p>"这是..."帕丽丝从长三郎的口袋里掏出一张纸条,"是狄瑞吉使徒的印记!还有...痛苦之村的地图?"</p>
<p>阿甘左接过地图看了看,沉声道:"狄瑞吉就在诺斯玛尔城市中心的坑洞深处,那里被称为'痛苦之村列瑟芬'。"</p>
<p>"痛苦之村..."林克喃喃自语。</p>
<p>"狄瑞吉是第六使徒,瘟疫的化身。"阿甘左严肃地说道,"以你们现在的实力,还不是他的对手。"</p>
<p>"我知道。"林克点头,"我准备去找GSD接受觉醒试炼。"</p>
<p>"觉醒?"阿甘左看了林克一眼,"你已经是48级了"</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 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-51.html" class="nav-btn ">上一章</a>
<a href="../chapters.html" class="nav-btn">目录</a>
<button class="nav-btn" id="ttsToggleBtn">朗读</button>
<a href="chapter-53.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-overlay" id="ttsOverlay">
<div class="tts-panel">
<div class="tts-header">
<div class="tts-title">🔊 语音朗读</div>
<button class="tts-close" id="ttsClose">×</button>
</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">慢速 (0.5x)</option>
<option value="0.75">较慢 (0.75x)</option>
<option value="1" selected>正常 (1x)</option>
<option value="1.25">较快 (1.25x)</option>
<option value="1.5">快速 (1.5x)</option>
<option value="2">极速 (2x)</option>
</select>
</div>
</div>
</div>
<!-- 侧边栏章节导航 -->
<aside class="sidebar">
<div class="sidebar-title">章节导航</div>
<div class="sidebar-content" id="sidebarContent">
<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 ">第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 current">第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>
<a href="chapter-68.html" class="sidebar-chapter ">第68章绿都格罗兹尼·魔雷者莫纳亨</a>
<a href="chapter-69.html" class="sidebar-chapter ">第69章魔雷者的苏醒·莫纳亨的抉择</a>
<a href="chapter-70.html" class="sidebar-chapter ">第70章天界之门·根特外围的战火</a>
<a href="chapter-71.html" class="sidebar-chapter ">第71章根特北门·泽丁的誓言</a>
<a href="chapter-72.html" class="sidebar-chapter ">第72章根特南门·马琳的效忠</a>
<a href="chapter-73.html" class="sidebar-chapter ">第73章根特防御战·钢铁与血肉的碰撞</a>
<a href="chapter-74.html" class="sidebar-chapter ">第74章夜间袭击战·银勺杂技团的覆灭</a>
<a href="chapter-75.html" class="sidebar-chapter ">第75章补给线阻断战·UM-0终结者</a>
<a href="chapter-76.html" class="sidebar-chapter ">第76章追击歼灭战·机械吉赛尔的末路</a>
<a href="chapter-77.html" class="sidebar-chapter ">第77章海上列车·鲁夫特悬空海港</a>
<a href="chapter-78.html" class="sidebar-chapter ">第78章列车上的海贼·铁鳞团的覆灭</a>
<a href="chapter-79.html" class="sidebar-chapter ">第79章夺回西部线·卡勒特的余孽</a>
<a href="chapter-80.html" class="sidebar-chapter ">第80章雾都赫伊斯·无法地带的阴影</a>
<a href="chapter-81.html" class="sidebar-chapter ">第81章阿登高地·GT-9600</a>
<a href="chapter-82.html" class="sidebar-chapter ">第82章卡勒特指挥部·兰蒂卢斯</a>
</div>
</aside>
<script>
// 记录阅读进度
let readChapters = JSON.parse(localStorage.getItem('readChapters') || '[]');
if (!readChapters.includes(52)) {
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弹出面板 ==========
const ttsOverlay = document.getElementById('ttsOverlay');
const ttsToggleBtn = document.getElementById('ttsToggleBtn');
const ttsClose = document.getElementById('ttsClose');
// 打开TTS面板
ttsToggleBtn.addEventListener('click', () => {
ttsOverlay.classList.add('show');
initTTS();
});
// 关闭TTS面板
ttsClose.addEventListener('click', () => {
ttsOverlay.classList.remove('show');
});
// 点击遮罩关闭
ttsOverlay.addEventListener('click', (e) => {
if (e.target === ttsOverlay) {
ttsOverlay.classList.remove('show');
}
});
// ========== 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');
ttsToggleBtn.classList.add('active');
}
// 暂停
function pauseTTS() {
if (ttsIsPlaying) {
ttsSynth.pause();
ttsIsPaused = true;
document.getElementById('ttsPlay').classList.remove('active');
document.getElementById('ttsPause').classList.add('active');
ttsToggleBtn.classList.remove('active');
}
}
// 停止
function stopTTS() {
ttsSynth.cancel();
ttsIsPlaying = false;
ttsIsPaused = false;
ttsCurrentIndex = 0;
updateTTSProgress();
document.getElementById('ttsPlay').classList.remove('active');
document.getElementById('ttsPause').classList.remove('active');
ttsToggleBtn.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('beforeunload', stopTTS);
</script>
</body>
</html>