国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

JavaScript wird nicht wie erwartet ausgeführt
P粉005134685
P粉005134685 2024-04-04 13:05:32
0
1
569

Ich versuche, HTML-CSS-JS responsiv zu machen, aber es funktioniert nicht wie erwartet. Wenn es minimiert ist, reagiert es bereits, aber beim Klicken funktioniert es nicht. Navigation und Navigationsleiste werden beim Klicken nicht angezeigt und ausgeblendet. HTML und CSS funktionieren Aber ich wei? nicht, was falsch oder falsch ist Kann mir jemand helfen?

let menu = document.querySelector('#menu-icon');
let navbar = document.querySelector('.navbar');

console.log(menu); // cek "menu-icon" 
console.log(navbar); // cek "navbar"

menu.onclick = () => {
    menu.classList.toggle("bx-x");
    navbar.classList.toggle("open");
}
#menu-icon
{
    font-size: 35px;
    color: var(--text-color);
    cursor: pointer;
    z-index: 10001;
    display: none;
}


/* ini untuk mengatur tampilan hp */
@media (max-width: 1280px)
{
    header
    {
        padding: 14px 2%;
        transition: .2s;
    }
    .navbar a
    {
        padding: 5px 0;
        margin: 0px 20px;
    };
}

@media (max-width: 1090px)
{
    #menu-icon
    {
        display: block;
    }   
    .navbar
    {
        position: absolute;
        top: 100%;
        right: -100%;
        width: 270px;
        height: 29hv;
        background: var(--main-color);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        border-radius: 10px;
        transition: all .50s ease;
    }

    .navbar .open
    {
        right: 2%;
    }
}
    
      <ul class="navbar">
        <li><a href="#" class="active">HOME</a></li>
        <li><a href="#">EVENT</a></li>
        <li><a href="#">ABOUT</a></li>
      </ul>
      <div class="main">
        <div class="bx bx-menu" id="menu-icon"></div>
      </div>
    </header>
    <!-- js link -->
    <script type="text/javascript" src="js/script">
    </script>

P粉005134685
P粉005134685

Antworte allen(1)
P粉605385621

錯(cuò)誤出現(xiàn)在您的 CSS 中:

.navbar .open

將其更改為:

.navbar.open

代碼中出現(xiàn)的規(guī)則指定了一個(gè)具有 open 類(lèi)的元素,該元素具有一個(gè)具有 navbar 類(lèi)的祖先。您想要的規(guī)則是指定一個(gè)具有both類(lèi)navbaropen的元素。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage