# 狗狗前端 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=100%, initial-scale=1.0"> <title>mydeerdognft</title> <script> window.onload = function () { var img = document.getElementsByClassName("php")[0]; var imgArr=["./images/banner1.jpeg","./images/banner2.jpeg","./images/banner3.jpeg","./images/banner4.jpeg","./images/banner5.jpeg"] var index = 0; var info = document.getElementById("info"); document.getElementById("prev").onclick = function () { index--; if (index < 0) { index = imgArr.length - 1; } img.src = imgArr[index]; }; document.getElementById("next").onclick = function () { index++; if (index > imgArr.length - 1) { index = 0; } img.src = imgArr[index]; } }; </script> </head> <body style="background-color:#fff7e9" " > <noscript>You need to enable JavaScript to run this app.</noscript> <div class="first" style="position: relative";> <img src="new2 狗與鹿 NFT 網頁設計-01.jpg" style=" width:100% ; margin-top: -5.5px; " > <a href="https://medium.com/@mydeerdognft"> <button style=" background-color: aqua; opacity: 0; position: absolute; top: 4%; left: 41% ; width: 10%; height: 5.5%; cursor: pointer; "> </button> </a> <a href="#foreword"> <button style=" background-color: rgb(90, 84, 202); opacity: 0; position: absolute; top: 4%; left: 52% ; width: 11%; height: 5.5%; cursor: pointer; "> </button> </a> <a href="#power"> <button style=" background-color: rgb(202, 84, 176); opacity: 0; position: absolute; top: 4%; left: 63% ; width: 11%; height: 5.5%; cursor: pointer; "> </button> </a> <a href="#art"> <button style=" background-color: rgb(129, 202, 84); opacity: 0; position: absolute; top: 4%; left: 75% ; width: 11%; height: 5.5%; cursor: pointer; "> </button> </a> <a href="https://www.oursong.com/@MydeerdogNFT"> <button style=" background-color: rgb(190, 122, 33); opacity: 0; position: absolute; top: 52%; left: 63% ; width: 18%; height: 13%; cursor: pointer;" > </button> </a> </a> <a href="#team"> <button style=" background-color: rgb(190, 122, 33); opacity: 0; position: absolute; top: 4%; left: 86.5% ; width: 11%; height: 5.5%; cursor: pointer; "> </button> </a> </div> <div class="container" style="position: relative ;"> <div class="p002"> <div id="foreword" style=" position: absolute; opacity: 1; left: 50%; top: 70%; "> </div> <div class="p001"> <iframe src="https://www.youtube.com/embed/CHwo5jXigJE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" style=" position: absolute; left: 26.2%; width: 46.7%; height: 44.5%; border-radius: 10pt; top:7.3%; " > </iframe> </div> <img src="new2 狗與鹿 NFT 網頁設計-02.jpg" style="width:100%; margin-top:-5.8px; " > </div> </div> <img src="new2 狗與鹿 NFT 網頁設計-03.jpg" style="width:100%; margin-top: -5.8px; " > </div> <div style="position: relative ;"> <div class="p003" ;"> <div id="power" style=" position: absolute; border: 10px solid gray; opacity: 0; left: 50%; top: 53%; "> </div></div> <img src="new2 狗與鹿 NFT 網頁設計-04.jpg" style="width:100%; margin-top: -5.83px; " > </div></div> <div style="position: relative ;"> <div class="p004"> <div id="art" style=" position: absolute; border: 10px solid rgb(43, 173, 28); opacity: 0; left: 50%; top: 25%; "> </div> <img src="new2 狗與鹿 NFT 網頁設計-05.jpg" id="art" style="width:100%; margin-top: -5.8px; " > </div> <div style="position: relative ;"> <div class="outer"> <p id="info"></p> <img src="./images/banner1.jpeg" alt="圖片" title="圖片" class="php" style= " position: absolute; width: 25%; top:7%; height: 13.5%; left:38.3% "> </div> <button id='prev' style= "position: absolute;left:15%;top:12%;width: 12%;height: 6%;background-color: #ffffff00;border: 0px; cursor: pointer;"></button> <button id='next' style= "position: absolute;right:15%;top:12%;width: 12%;height: 6%;background-color: #ffffff00;border: 0px; cursor: pointer;"></button> <div class="p005"> <div id="team" style=" position: absolute; border: 10px solid rgb(28, 108, 173); opacity: 0; left: 50%; top: 25%; "> </div> <img src="new2 狗與鹿 NFT 網頁設計-06.jpg" style="width:100%; margin-top: -5.8px; z-index: 0;" > </div> <img src="new2 狗與鹿 NFT 網頁設計-07.jpg" style="width:100%; margin-top: -5.8px; " > <img src="new2 狗與鹿 NFT 網頁設計-08.jpg" style="width:100%; margin-top: -5.8px; " > </div></div> </body> </html>