「メインページ」の版間の差分
提供: 川西図鑑
その他の操作
編集の要約なし |
編集の要約なし タグ: 差し戻し済み |
||
| 1行目: | 1行目: | ||
<html> | <html> | ||
<div id="book-opening"> | |||
<div class="book-cover"> | |||
<div class="book-title">川西図鑑</div> | |||
</div> | |||
</div> | |||
<div class="kawanishi-top"> | <div class="kawanishi-top"> | ||
| 140行目: | 145行目: | ||
</section> | </section> | ||
</div> | </div> | ||
<script> | |||
window.addEventListener('load', () => { | |||
setTimeout(() => { | |||
const book = document.getElementById('book-opening'); | |||
if (book) book.remove(); | |||
}, 1300); | |||
}); | |||
</script> | |||
<style> | <style> | ||
#book-opening { | |||
position: fixed; | |||
inset: 0; | |||
background: #f8fafc; | |||
z-index: 9999; | |||
perspective: 2000px; | |||
pointer-events: none; | |||
} | |||
.book-cover { | |||
width: 100%; | |||
height: 100%; | |||
background: linear-gradient(135deg, #e5e7eb, #f9fafb); | |||
transform-origin: left center; | |||
animation: openBook 1.2s ease-in-out forwards; | |||
} | |||
.book-title { | |||
position: absolute; | |||
inset: 0; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
font-size: 3rem; | |||
font-weight: 700; | |||
letter-spacing: 0.08em; | |||
color: #111827; | |||
} | |||
@keyframes openBook { | |||
0% { | |||
transform: rotateY(0deg); | |||
} | |||
100% { | |||
transform: rotateY(-110deg); | |||
} | |||
} | |||
.kawanishi-top { | .kawanishi-top { | ||
max-width: 1100px; | max-width: 1100px; | ||
2025年12月25日 (木) 19:36時点における版
川西図鑑
図鑑で探す
準備中
記事
川西のさまざまな図鑑ページに関連する、
ユーザーが書いた記事を紹介します。
川西能勢口で見つけた小さな名店
昔の川西と今を比べてみる
川西で活動する人たち
今日の川西
ランダムに1件表示しています。
エラー: テーブル飲食店情報が見つかりません。