Hirdetés

Keresés

Új hozzászólás Aktív témák

  • Taci
    addikt

    Sziasztok!

    Szeretnék segítséget kérni, mert kezdek belezavarodni. Összeszámolni nem tudom, hány kódot probáltam ma le, eredménytelenül, semmi sem működik.

    Adott a következő szituáció:

    <HTML>
    <link href="styles1.css" rel="stylesheet">
    <link href="styles2.css" rel="stylesheet">
    <div id="kiskacsa">Szöveg</div>
    <button onclick="change()">Változz át CSS2-re</button>
    </HTML>

    CSS1
    #kiskacsa {font-size: 20px; color: black; background-color: red;}

    CSS2
    #kiskacsa {font-size: 30px; color: white; background-color: green;}

    És itt jön a feketeleves. Mi kell a JS file-ba, hogy alapértelmezett CSS1 helyett CSS2 lépjen érvénybe? Annyi mindent kipróbáltam már, de mindhiába.

    Próbáld meg esetleg így:

    <HTML>
    <link href="styles1.css" rel="stylesheet" id="themecss">
    <div id="kiskacsa">Szöveg</div>
    <button onclick="change()">Változz át CSS2-re</button>
    </HTML>

    És hozzá a JS:
    const themecss = document.querySelector("#themecss");
    function change() {
       if (themecss.getAttribute("href") == "styles1.css") {
           themecss.href = "styles2.css";
        } else if (themecss.getAttribute("href") == "styles2.css"){
           themecss.href = "styles1.css";
        }
    }

    Nyugodtan javítsátok, ha így nem pontos. Meg persze lehetne switch-csel is, szebb is úgy talán. De nagyjából így működnie kellene.

  • coco2
    őstag

    Sziasztok!

    Szeretnék segítséget kérni, mert kezdek belezavarodni. Összeszámolni nem tudom, hány kódot probáltam ma le, eredménytelenül, semmi sem működik.

    Adott a következő szituáció:

    <HTML>
    <link href="styles1.css" rel="stylesheet">
    <link href="styles2.css" rel="stylesheet">
    <div id="kiskacsa">Szöveg</div>
    <button onclick="change()">Változz át CSS2-re</button>
    </HTML>

    CSS1
    #kiskacsa {font-size: 20px; color: black; background-color: red;}

    CSS2
    #kiskacsa {font-size: 30px; color: white; background-color: green;}

    És itt jön a feketeleves. Mi kell a JS file-ba, hogy alapértelmezett CSS1 helyett CSS2 lépjen érvénybe? Annyi mindent kipróbáltam már, de mindhiába.

    Class kellene annak a div-nek, és a class-ra írni a css-t, nem az id-ra. Aztán lesz ilyen lehetőség: How can I change an element's class with JavaScript?

Új hozzászólás Aktív témák