HTML-CSS-JAVASCRIPT/Dark Light Menu/Dark Light Menu.html at 47b65f2238dd00906a3f0aae82a3f61d1f8afd00 · Furkan-Gulsen/HTML-CSS-JAVASCRIPT · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8" />
    <title>page</title>
    <link rel="stylesheet" type="text/css" href="1.page.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
</head>
<body>

    <div class="container">
        <span class="dark">DARK</span>
        <div class="button"></div>
        <span class="light">LIGHT</span>
    </div>
    <div class="menu">
        <ul>
            <li><a class="active" href="#" >HOME</a></li>
            <li><a href="https://www.instagram.com/codeblogger/?hl=tr"  target="_blank">INSTAGRAM</a></li>
            <li><a href="https://github.com/furkangulsen98/HTML-CSS-JAVASCRIPT"  target="_blank">GITHUB</a></li>
            <li><a href="https://truecodes.org"  target="_blank">WEBPAGE</a></li>
            <li><a href="#">ABOUT</a></li>
        </ul>
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script type="text/javascript">
        $(".container").on("click", () => {
            $("body").toggleClass("light-theme");
        });
    </script>

</body>
</html>