Sorting-Algorithm-Visualizer/page9.html at main · SyedaRaviaEjaz/Sorting-Algorithm-Visualizer · 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
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="/Css/style.css" />
    <title>Bucket Sort</title>
</head>
<body><br/>
    <p class="header">Bucket Sort</p>
    <button id="myBtn" style="font-size: larger; background-color: #f0c506;">Complexity</button>
   <div id="myModal" class="modal">
     <div class="modal-content">
       <span class="close">&times;</span>
       <p>Worst Case Time Complexity = O(N^2)</p>
       <p>Average Case Time Complexity = O(N+K)</p>
       <p>Best Case Time Complexity = O(N+K)</p>
       <p>Space Complexity = O(N)</p>
     </div>
   </div>
   <script>
   var modal = document.getElementById("myModal");
   var btn = document.getElementById("myBtn");
   var span = document.getElementsByClassName("close")[0];
   btn.onclick = function() {
     modal.style.display = "block";
   }
   span.onclick = function() {
     modal.style.display = "none";
   }
   window.onclick = function(event) {
     if (event.target == modal) {
       modal.style.display = "none";
     }
   }
   </script>
    <div id="array"></div><br/><br />
    <div style="display: flex; justify-content: space-evenly">
        <div class="bucket">
            <div id="one" class="bucket2"></div><br/>
            <h3 style="text-align: center">[1-5]</h3>
        </div>
        <div class="bucket">
            <div id="two" class="bucket2"></div><br/>
            <h3 style="text-align: center">[6-10]</h3>
        </div>
        <div class="bucket">
            <div id="three" class="bucket2"></div><br/>
            <h3 style="text-align: center">[11-15]</h3>
        </div>
        <div class="bucket">
            <div id="four" class="bucket2"></div><br />
            <h3 style="text-align: center">[16-20]</h3>
        </div>
    </div>
    <script src="/Codes/bucket.js"></script>
</body>
</html>