131 lines
6.6 KiB
HTML
131 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-TW">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>水晶男孩｜六六歌2 — 節目影片</title>
|
|
<link rel="stylesheet" href="../assets/css/style.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
|
</head>
|
|
|
|
<body class="ebook-ssg2-page totoga2-page totoga2-video-copy-page">
|
|
<header class="map-archive-header">
|
|
<div class="header-inner">
|
|
<h1 class="main-title">無限挑戰 · 六六歌2</h1>
|
|
<div class="subtitle-wrap">
|
|
<span class="sub-title">水晶男孩回來啦！</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
|
|
|
<canvas id="particles"></canvas>
|
|
|
|
<div id="bilivideo-tabs" class="bilivideo-hub">
|
|
<p class="totoga2-copy-sibling-links content-container" aria-label="六六歌2 其他複本入口">
|
|
<a href="totoga2-copy-ebook.html">紀實電子書</a>
|
|
<span class="totoga2-copy-sibling-links__sep" aria-hidden="true">·</span>
|
|
<a href="totoga2-copy-timeline.html">時間軸＋長文</a>
|
|
<span class="totoga2-copy-sibling-links__sep" aria-hidden="true">·</span>
|
|
<a href="totoga2%20copy.html">複本總覽</a>
|
|
</p>
|
|
|
|
<div class="content-container ebook-main">
|
|
<section class="ebook-intro section" aria-labelledby="ebook-bilivideo-heading">
|
|
<h2 class="section-title" id="ebook-bilivideo-heading">節目影片</h2>
|
|
|
|
<div class="bilivideo-tabs__shell">
|
|
<nav class="bilivideo-episode-nav" role="tablist" aria-label="節目影片集數">
|
|
<button type="button" class="btn bilivideo-episode-nav__tab bilivideo-episode-nav__tab--active"
|
|
role="tab" id="bilivideo-tab-1" aria-controls="bilivideo-panel-1"
|
|
aria-selected="true">上集</button>
|
|
<button type="button" class="btn bilivideo-episode-nav__tab" role="tab" id="bilivideo-tab-2"
|
|
aria-controls="bilivideo-panel-2" aria-selected="false" tabindex="-1">中集</button>
|
|
<button type="button" class="btn bilivideo-episode-nav__tab" role="tab" id="bilivideo-tab-3"
|
|
aria-controls="bilivideo-panel-3" aria-selected="false" tabindex="-1">下集</button>
|
|
</nav>
|
|
<div class="bilivideo-tabs__panels">
|
|
<div class="bilivideo-tabs__panel" role="tabpanel" id="bilivideo-panel-1"
|
|
aria-labelledby="bilivideo-tab-1">
|
|
<div class="bilivideo-frame">
|
|
<iframe title="無限挑戰 六六歌2 上集"
|
|
src="//player.bilibili.com/player.html?isOutside=true&aid=12288323&bvid=BV1Yx411B7TC&cid=20353565&p=1"
|
|
scrolling="no" border="0" frameborder="no" framespacing="0"
|
|
allowfullscreen="true"></iframe>
|
|
</div>
|
|
</div>
|
|
<div class="bilivideo-tabs__panel" role="tabpanel" id="bilivideo-panel-2"
|
|
aria-labelledby="bilivideo-tab-2" hidden>
|
|
<div class="bilivideo-frame">
|
|
<iframe title="無限挑戰 六六歌2 中集"
|
|
data-src="//player.bilibili.com/player.html?isOutside=true&aid=12288323&bvid=BV1Yx411B7TC&cid=20353561&p=2"
|
|
scrolling="no" border="0" frameborder="no" framespacing="0"
|
|
allowfullscreen="true"></iframe>
|
|
</div>
|
|
</div>
|
|
<div class="bilivideo-tabs__panel" role="tabpanel" id="bilivideo-panel-3"
|
|
aria-labelledby="bilivideo-tab-3" hidden>
|
|
<div class="bilivideo-frame">
|
|
<iframe title="無限挑戰 六六歌2 下集"
|
|
data-src="//player.bilibili.com/player.html?isOutside=true&aid=12288323&bvid=BV1Yx411B7TC&cid=20353562&p=3"
|
|
scrolling="no" border="0" frameborder="no" framespacing="0"
|
|
allowfullscreen="true"></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="ebook-back-link content-container">
|
|
<a href="../index.html#story" class="btn">回到首頁 · 傳奇的轉折</a>
|
|
</p>
|
|
|
|
<footer>
|
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
|
</a>
|
|
</footer>
|
|
|
|
<script src="../assets/js/particles.js"></script>
|
|
<script src="../assets/js/portal-nav.js"></script>
|
|
<script>
|
|
(function () {
|
|
var root = document.getElementById("bilivideo-tabs");
|
|
if (!root) return;
|
|
var tabs = Array.prototype.slice.call(root.querySelectorAll('[role="tab"]'));
|
|
var panels = Array.prototype.slice.call(root.querySelectorAll('[role="tabpanel"]'));
|
|
|
|
function activate(index) {
|
|
tabs.forEach(function (tab, i) {
|
|
var on = i === index;
|
|
tab.setAttribute("aria-selected", on ? "true" : "false");
|
|
tab.tabIndex = on ? 0 : -1;
|
|
if (on) tab.classList.add("bilivideo-episode-nav__tab--active");
|
|
else tab.classList.remove("bilivideo-episode-nav__tab--active");
|
|
panels[i].hidden = !on;
|
|
if (on) {
|
|
var iframe = panels[i].querySelector("iframe[data-src]");
|
|
if (iframe && !iframe.getAttribute("src")) {
|
|
iframe.setAttribute("src", iframe.getAttribute("data-src"));
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
tabs.forEach(function (tab, i) {
|
|
tab.addEventListener("click", function () {
|
|
activate(i);
|
|
});
|
|
});
|
|
activate(0);
|
|
})();
|
|
</script>
|
|
</body>
|
|
|
|
</html> |