jianzhihuixiang/alacarte-novel-website/chapters/chapter-48.html
2026-03-29 14:08:36 +08:00

947 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;
}
/* 右侧滚动按钮 */
.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: 1001;
background: rgba(0,0,0,0.5);
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: 75px;
min-width: auto;
padding: 12px;
width: auto;
}
.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;
}
}
@media (max-width: 400px) {
.tts-panel {
bottom: 70px;
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 48</div>
<h1 class="chapter-title">{{CHAPTER_TITLE}}</h1>
</header>
<article class="chapter-content">
<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>"我是布万加班图族第37代族长。"布万加拔出那柄巨大的战斧,"今天,我要终结你五百年的暴政!"</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>林克握住他的手,笑了:"谢谢你,奥尔卡队长。"</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 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 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>
<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-47.html" class="nav-btn ">上一章</a>
<a href="../chapters.html" class="nav-btn">目录</a>
<a href="chapter-49.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-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 ">第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 current">第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>
<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>
</div>
</aside>
<script>
// 记录阅读进度
let readChapters = JSON.parse(localStorage.getItem('readChapters') || '[]');
if (!readChapters.includes(48)) {
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>