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

977 lines
42 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 95</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>这个老人,即使身处绝境,依然保持着善良的本心。</p>
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</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 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 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>战斗瞬间爆发!</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>作为一个穿越者他对DNF的世界观有一定的了解。在原作中卢克的能量核心是可以通过特殊的材料重新激活的...</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 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>战斗再次爆发!</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>
</article>
</div>
<!-- 固定底部导航 -->
<nav class="fixed-nav">
<div class="fixed-nav-content">
<a href="chapter-94.html" class="nav-btn ">上一章</a>
<a href="../chapters.html" class="nav-btn">目录</a>
<a href="chapter-96.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-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>
<a href="chapter-83.html" class="sidebar-chapter ">第83章皇女的告白·天界的新篇章</a>
<a href="chapter-84.html" class="sidebar-chapter ">第84章幽灵列车·亡者的低语</a>
<a href="chapter-85.html" class="sidebar-chapter ">第85章伊顿工业区·克雷发电站</a>
<a href="chapter-86.html" class="sidebar-chapter ">第86章普鲁兹发电站·闪电之帕特里斯</a>
<a href="chapter-87.html" class="sidebar-chapter ">第87章特伦斯发电站·熔岩之萨姆</a>
<a href="chapter-88.html" class="sidebar-chapter ">第88章格兰迪发电站·虚空之弗曼</a>
<a href="chapter-89.html" class="sidebar-chapter ">第89章安图恩攻坚战·黑雾之源</a>
<a href="chapter-90.html" class="sidebar-chapter ">第90章安图恩攻坚战·震颤的大地</a>
<a href="chapter-91.html" class="sidebar-chapter ">第91章安图恩攻坚战·擎天之柱</a>
<a href="chapter-92.html" class="sidebar-chapter ">第92章安图恩攻坚战·黑色火山</a>
<a href="chapter-93.html" class="sidebar-chapter ">第93章安图恩攻坚战·使徒陨落</a>
<a href="chapter-94.html" class="sidebar-chapter ">第94章克洛诺斯岛·寂静城的召唤</a>
<a href="chapter-95.html" class="sidebar-chapter current">第95章寂静城的秘密</a>
<a href="chapter-96.html" class="sidebar-chapter ">第96章番外·贝奇的献身</a>
<a href="chapter-97.html" class="sidebar-chapter ">第97章光之舞会</a>
<a href="chapter-98.html" class="sidebar-chapter ">第98章钢铁之臂</a>
<a href="chapter-99.html" class="sidebar-chapter ">第99章能源熔炉</a>
<a href="chapter-100.html" class="sidebar-chapter ">第100章王之书库</a>
<a href="chapter-101.html" class="sidebar-chapter ">第101章不灭回廊</a>
<a href="chapter-102.html" class="sidebar-chapter ">第102章机械王座</a>
<a href="chapter-103.html" class="sidebar-chapter ">第103章番外·寂静城的早晨</a>
<a href="chapter-104.html" class="sidebar-chapter ">第104章番外·贝奇与艾泽拉</a>
<a href="chapter-105.html" class="sidebar-chapter ">第105章番外·卢克的嘱托</a>
<a href="chapter-106.html" class="sidebar-chapter ">第106章时空之门的召唤</a>
<a href="chapter-107.html" class="sidebar-chapter ">第107章格兰之火</a>
<a href="chapter-108.html" class="sidebar-chapter ">第108章瘟疫之源</a>
<a href="chapter-109.html" class="sidebar-chapter ">第109章卡勒特之初</a>
<a href="chapter-110.html" class="sidebar-chapter ">第110章无法地带</a>
<a href="chapter-111.html" class="sidebar-chapter ">第111章暗黑圣战</a>
<a href="chapter-112.html" class="sidebar-chapter ">第112章昔日悲鸣</a>
<a href="chapter-113.html" class="sidebar-chapter ">第113章凛冬</a>
<a href="chapter-114.html" class="sidebar-chapter ">第114章迷之觉悟</a>
<a href="chapter-115.html" class="sidebar-chapter ">第115章番外·艾丽丝的抉择</a>
<a href="chapter-116.html" class="sidebar-chapter ">第116章番外·后宫的日常</a>
<a href="chapter-117.html" class="sidebar-chapter ">第117章番外·与赛丽亚的约会</a>
<a href="chapter-118.html" class="sidebar-chapter ">第118章番外·与奥菲利亚的重逢</a>
<a href="chapter-119.html" class="sidebar-chapter ">第119章番外·与敏泰的雪山之行</a>
<a href="chapter-120.html" class="sidebar-chapter ">第120章番外·与莎兰的魔法时光</a>
<a href="chapter-121.html" class="sidebar-chapter ">第121章番外·与帕丽丝的格斗训练</a>
<a href="chapter-122.html" class="sidebar-chapter ">第122章番外·与莫纳亨的念动力</a>
<a href="chapter-123.html" class="sidebar-chapter ">第123章番外·与泽丁的天界巡逻</a>
<a href="chapter-124.html" class="sidebar-chapter ">第124章番外·与马琳的骑士之道</a>
<a href="chapter-125.html" class="sidebar-chapter ">第125章番外·与皇女的皇家约会</a>
</div>
</aside>
<script>
// 记录阅读进度
let readChapters = JSON.parse(localStorage.getItem('readChapters') || '[]');
if (!readChapters.includes(95)) {
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>