jianzhihuixiang/alacarte-novel-website/chapters/chapter-133.html
2026-03-29 13:57:51 +08:00

937 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: 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;
bottom: 80px;
min-width: 150px;
padding: 10px;
}
.tts-btn {
width: 32px;
height: 32px;
font-size: 12px;
}
}
/* 侧边栏 - 标题固定,内容滚动 */
.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 133</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>"林克!艾丽丝姐姐!等等我!"</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 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 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>火光映照在尼梅尔脸上,她的脸颊微微泛红,眼中满是紧张和期待。</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 style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</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 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 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 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 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-132.html" class="nav-btn ">上一章</a>
<a href="../chapters.html" class="nav-btn">目录</a>
<a href="chapter-134.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-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>
<a href="chapter-126.html" class="sidebar-chapter ">第126章番外·与米娅的工坊时光</a>
<a href="chapter-127.html" class="sidebar-chapter ">第127章番外·与贝奇的人造之心</a>
<a href="chapter-128.html" class="sidebar-chapter ">第128章番外·与艾泽拉的守护誓言</a>
<a href="chapter-129.html" class="sidebar-chapter ">第129章魔界的召唤</a>
<a href="chapter-130.html" class="sidebar-chapter ">第130章魔界营地</a>
<a href="chapter-131.html" class="sidebar-chapter ">第131章凯蒂的指引</a>
<a href="chapter-132.html" class="sidebar-chapter ">第132章营地危机</a>
<a href="chapter-133.html" class="sidebar-chapter current">第133章尼梅尔的心意</a>
<a href="chapter-134.html" class="sidebar-chapter ">第134章中央公园</a>
<a href="chapter-135.html" class="sidebar-chapter ">第135章剑圣的试炼</a>
<a href="chapter-136.html" class="sidebar-chapter ">第136章地轨中心</a>
<a href="chapter-137.html" class="sidebar-chapter ">第137章魔剑士阿斯兰</a>
<a href="chapter-138.html" class="sidebar-chapter ">第138章泪目之眼</a>
<a href="chapter-139.html" class="sidebar-chapter ">第139章使徒会晤</a>
<a href="chapter-140.html" class="sidebar-chapter ">第140章复仇之剑</a>
<a href="chapter-141.html" class="sidebar-chapter ">第141章寂静城再访</a>
<a href="chapter-142.html" class="sidebar-chapter ">第142章时间之钥</a>
<a href="chapter-143.html" class="sidebar-chapter ">第143章翡翠梦魇</a>
<a href="chapter-144.html" class="sidebar-chapter ">第144章诅咒的守护者</a>
<a href="chapter-145.html" class="sidebar-chapter ">第145章精灵的誓言</a>
<a href="chapter-146.html" class="sidebar-chapter ">第146章深渊之眼</a>
<a href="chapter-147.html" class="sidebar-chapter ">第147章赫尔德的仪式</a>
<a href="chapter-148.html" class="sidebar-chapter ">第148章战后余晖</a>
<a href="chapter-149.html" class="sidebar-chapter ">第149章泰波尔斯的召唤</a>
<a href="chapter-150.html" class="sidebar-chapter ">第150章天空之城</a>
<a href="chapter-151.html" class="sidebar-chapter ">第151章风暴试炼</a>
<a href="chapter-152.html" class="sidebar-chapter ">第152章光芒与暗影</a>
<a href="chapter-153.html" class="sidebar-chapter ">第153章天空之战</a>
<a href="chapter-154.html" class="sidebar-chapter ">第154章天空之战</a>
<a href="chapter-155.html" class="sidebar-chapter ">第155章天空之战</a>
<a href="chapter-156.html" class="sidebar-chapter ">第156章格兰之森异象</a>
<a href="chapter-157.html" class="sidebar-chapter ">第157章魔界深处</a>
<a href="chapter-158.html" class="sidebar-chapter ">第158章幻象迷宫</a>
<a href="chapter-159.html" class="sidebar-chapter ">第159章无形之战</a>
<a href="chapter-160.html" class="sidebar-chapter ">第160章无形者的秘密</a>
<a href="chapter-161.html" class="sidebar-chapter ">第161章光之试炼</a>
<a href="chapter-162.html" class="sidebar-chapter ">第162章希洛克的陷阱</a>
<a href="chapter-163.html" class="sidebar-chapter ">第163章无形之战</a>
</div>
</aside>
<script>
// 记录阅读进度
let readChapters = JSON.parse(localStorage.getItem('readChapters') || '[]');
if (!readChapters.includes(133)) {
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>