https://gablaxy.github.io/stellar_system/

掃描 ID：: 8cb39042-5c6b-41ed-bb75-5cd8df51999b已完成
已提交的 URL：: https://gablaxy.github.io/stellar_system/
報告完成時間：: 2024年11月25日 23:22:02

連結 · 找到 0 個

從頁面中識別的傳出連結

JavaScript 變數 · 找到 4 個

在頁面的視窗物件上載入的全域 JavaScript 變數是在函數外部宣告的變數，可從目前範圍內程式碼中的任何位置存取

名稱	類型
onbeforetoggle	object
documentPictureInPicture	object
onscrollend	object
removePA	function

主控台記錄訊息 · 找到 2 條

記錄到 Web 主控台的訊息

類型	類別	記錄
warning	other	Text Error with Permissions-Policy header: Origin trial controlled feature not enabled: 'interest-cohort'.
error	network	URL https://gablaxy.github.io/favicon.ico Text Failed to load resource: the server responded with a status of 404 ()

HTML

頁面的原始 HTML 主體

<!DOCTYPE html><html lang="en"><head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Stellar system</title>
        <link rel="stylesheet" href="./style/index.css">
        <link rel="stylesheet" href="./style/common.css">
    </head>
    <body>
        <div class="stars"></div>
        <div class="all">
                <div class="Soleil"></div>
                <div class="Mercure planete"></div>
                <div class="Venus planete"></div>
                <div class="Terre planete"></div>
                <div class="Mars planete"></div>
                <div class="Jupiter planete"></div>
                <div class="Saturne planete"></div>
                <div class="Uranus planete"></div>
                <div class="Neptune planete"></div>
        </div>
        <div class="menu">
            <h1>Menu</h1>
            <h3 id="nom_planete"></h3>
            <a href="" id="zoom_link"><button class="zoom">Zoom</button></a>
        </div>
        <script type="text/javascript">
            let planetes = document.querySelectorAll(".planete");
            let soleil = document.querySelector(".Soleil");
            let menu = document.querySelector(".menu");
            let zlink = document.getElementById("zoom_link");

            function removePA() {
                planetes.forEach(element => {
                    element.classList.remove("planete_active");
                });
            }

            // When the sun is clicked, the planets are no longer highlighted
            soleil.addEventListener("click", function(){
                removePA();
                menu.style.display = "block";
                document.getElementById("nom_planete").innerHTML = "Soleil";
            });

            planetes.forEach(element => {
                element.addEventListener("click", function(){
                    removePA();
                    menu.style.display = "block";
                    element.classList.add("planete_active");
                    document.getElementById("nom_planete").innerHTML = element.classList[0];
                    zlink.href = "./planetes/" + element.classList[0] + ".html";
                });
            });

            menu.addEventListener("click", function(){
                menu.style.display = "none";
                removePA();
            });

        

        </script>
    

</body></html>