mardi 22 octobre 2019

Change CSS Stylesheet when checkbox is marked

I was trying to create a checkbox in HTML which changes the current stylesheet to another one using JS.

Here is the code I have written:

HTML:

<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Normal Title</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link id="pageStyle" rel="stylesheet" href="style.css">
    <script>
        function swapStyleSheet(sheet) {

        if (document.getElementById("lightSwitch").checked == true) {

        document.getElementById("pageStyle").set.Attribute('href', sheet) = "dark.css";

            } 
        else {

        document.getElementById("pageStyle").set.Attribute('href', sheet) = "style.css";

            }
        }
    </script>
</head>
<body>

        <input onclick="swapStyleSheet()" id="lightSwitch" type="checkbox" name="lightSwitch">

</body>

Thanks for clarifying the problem for me.




Aucun commentaire:

Enregistrer un commentaire