pj/fes.html at 42624ddea4b856c6c6196996cdf765d6ab4511a8

Fork: 1

fesmap / pj

forked from Ray8/pj

Find file

Newer

Older

pj / fes.html

Kitada Eito on 29 Sep 1 KB Update fes.html

Raw Blame History

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>文化祭マップ</title>
  <link rel="stylesheet" href="fes.css">
</head>
<body>
  <header class="site-header">
    <h1>🌸 文化祭マップ 🌸</h1>
    <nav class="tabs" role="tablist" aria-label="フロア選択">
      <button class="tab-button active" data-floor="1" role="tab" aria-selected="true">1階</button>
      <button class="tab-button" data-floor="2" role="tab" aria-selected="false">2階</button>
      <button class="tab-button" data-floor="3" role="tab" aria-selected="false">3階</button>
      <button class="tab-button" data-floor="4" role="tab" aria-selected="false">4階</button>
      <button class="tab-button" data-floor="5" role="tab" aria-selected="false">体育館</button>
    </nav>
  </header>

  <main>
    <div id="mapWrapper">
      <div id="map">
        <img id="mapImage" src="images/1floor.png" alt="文化祭マップ">
      </div>
    </div>
  </main>

  <!-- 一覧パネル -->
  <button id="listToggle" aria-expanded="false" aria-controls="listPanel">一覧</button>
  <aside id="listPanel" class="list-panel" aria-hidden="true">
    <button id="closeList" class="close-list-btn">✕ 閉じる</button>
    <div id="listContent" tabindex="0"></div>
  </aside>

  <script src="fes.js"></script>
</body>
</html>