github-session/week3_3.html at main · DOHOON0127/github-session · 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
36
37
38
39
40
41
42
43
<!doctype html>
<html lang="kr">
<head>
    <meta charset="utf-8">
    <title>Q3</title>
    <style>
        img {
            width: 100%;
            height: 100%;
            max-width: 100vw;
            max-height: 100vh;
            object-fit: cover;
        }
    </style>


    <script language="JavaScript">
        function layer1(){
            map.style.visibility = "hidden"
        }

        function layer2(){
            map.style.visibility = "visible"
        }

    </script>
</head>
<body>
    <div>
        <input type="radio" id="one" name="vis" value="1" onclick="layer1()"> 숨기기
        <input type="radio" id="two" name="vis" value="2" onclick="layer2()"> 보이기
    </div>
    <div id="map">
        <script>
            var map = document.createElement('img');
            map.setAttribute('src', 'week3_3_img.png');
            map.setAttribute('style', 'width:100%; height:100%; object-fit:cover; max-width:100vw; max-height:100vh;');

            document.body.appendChild(map);
        </script>
    </div>
</body>
</html>