Spaces:
No application file
No application file
| <html> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>Thư Giáng Sinh 💌</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Pacifico&family=Poppins:wght@400;600&display=swap" rel="stylesheet" /> | |
| <link rel="stylesheet" href="./style/style.css"> | |
| </head> | |
| <body> | |
| <img src="https://i.pinimg.com/originals/7f/1f/76/7f1f76ac29bc01ad318abbf0468b1062.gif" class="santa" alt=""> | |
| <div class="star-field"></div> | |
| <div class="envlope-wrapper"> | |
| <div id="envelope" class="close"> | |
| <div class="wax-seal"></div> | |
| <div class="front flap"></div> | |
| <div class="front pocket"></div> | |
| <div class="letter"> | |
| <div class="letter-corner corner-tl"></div> | |
| <div class="letter-corner corner-br"></div> | |
| <div class="message"> | |
| <div class="lyrics"> | |
| <div class="lyric-page active" id="page1"><p>Gửi em... 🎄❤️</p></div> | |
| <div class="lyric-page" id="page2"><p>Giáng Sinh lại về, mang theo cái lạnh dễ thương của mùa đông…</p></div> | |
| <div class="lyric-page" id="page3"><p>và cả những điều anh muốn nói với em từ lâu.</p></div> | |
| <div class="lyric-page" id="page4"><p>Trong ánh đèn Noel lấp lánh,</p></div> | |
| <div class="lyric-page" id="page5"><p>anh chỉ ước có em bên cạnh để sẻ chia ấm áp.</p></div> | |
| <div class="lyric-page" id="page6"><p>Em biết không… ✨</p></div> | |
| <div class="lyric-page" id="page7"><p>sự xuất hiện của em khiến mùa đông này trở nên đặc biệt hơn.</p></div> | |
| <div class="lyric-page" id="page8"><p>Không cần tuyết rơi,</p></div> | |
| <div class="lyric-page" id="page9"><p>chỉ cần nụ cười của em là đủ làm trái tim anh ấm lại.</p></div> | |
| <div class="lyric-page" id="page10"><p>Giáng Sinh là mùa của yêu thương,</p></div> | |
| <div class="lyric-page" id="page11"><p>và anh muốn dành phần yêu thương nhất cho em. ❤️</p></div> | |
| <div class="lyric-page" id="page12"><p>Anh chẳng có món quà đắt tiền nào,</p></div> | |
| <div class="lyric-page" id="page13"><p>chỉ có tấm lòng chân thành muốn gửi đến em.</p></div> | |
| <div class="lyric-page" id="page14"><p>Anh chúc em một mùa Noel an yên,</p></div> | |
| <div class="lyric-page" id="page15"><p>một trái tim ấm áp,</p></div> | |
| <div class="lyric-page" id="page16"><p>và một nụ cười luôn nở trên môi. ✨</p></div> | |
| <div class="lyric-page" id="page17"><p>Nếu có thể…</p></div> | |
| <div class="lyric-page" id="page18"><p>anh muốn trở thành người khiến em hạnh phúc trong mùa đông này.</p></div> | |
| <div class="lyric-page" id="page19"><p>Dẫu tuyết không rơi ở nơi ta sống,</p></div> | |
| <div class="lyric-page" id="page20"><p>anh vẫn mong mang đến cho em cảm giác đẹp như phép màu Giáng Sinh.</p></div> | |
| <div class="lyric-page" id="page21"><p>Cảm ơn em đã xuất hiện trong cuộc đời anh…</p></div> | |
| <div class="lyric-page" id="page22"><p>dù là vô tình hay do ông già Noel sắp đặt. 🎅💫</p></div> | |
| <div class="lyric-page" id="page23"><p>Merry Christmas, tình yêu của anh. ❤️🎄</p></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="hearts"> | |
| <div class="heart a1"></div> | |
| <div class="heart a2"></div> | |
| <div class="heart a3"></div> | |
| </div> | |
| <div class="sparkles"> | |
| <div class="sparkle s1"></div> | |
| <div class="sparkle s2"></div> | |
| <div class="sparkle s3"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="controls"> | |
| <button id="openBtn">Mở</button> | |
| <button id="resetBtn" style="display: none;">Đóng</button> | |
| </div> | |
| <audio id="sound" loop> | |
| <source src="./style/nhac.mp3" type="audio/mpeg" /> | |
| </audio> | |
| <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | |
| <script src="./style/script.js"></script> | |
| </body> | |
| </html> | |