htmlcodecamp/livepositiondemo.html at main · Varanasi-Software-Junction/htmlcodecamp · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Positioning Modes---Interactive</title>
</head>

<body>
    <select onchange="setPositioningMode(event)" onclickc="setPositioningMode(event)">
        <option value="">---</option>
        <option value="static">Static</option>
        <option value="absolute">Absolute</option>
        <option value="relative">Relative</option>
        <option value="fixed">Fixed</option>
        <option value="sticky">Sticky</option>

    </select>
    <div style="border-style: solid; border-color: teal; border-width: 1px;  position: relative;width: 100%;">
        Content
    </div>
    <script>
        function setPositioningMode(event) {
            const positionmode = event.target.value;
            console.log(positionmode);
        }

    </script>
</body>

</html>