Practical – 118.1 : Create a Simple Dynamic Pyramid

Program Code : 

<!DOCTYPE html>

<html>

<head>

  <title>Dynamic Pyramid in JavaScript</title>

  <style>

    body {

      font-family: Arial;

      text-align: center;

      padding: 20px;

    }

    pre {

      font-size: 18px;

      line-height: 1.5;

    }

    input {

      padding: 5px;

      font-size: 16px;

    }

  </style>

</head>

<body>

  <h2>Dynamic Pyramid Generator</h2>

  <label for=”rows”>Enter number of rows:</label>

  <input type=”number” id=”rows” min=”1″ value=”5″>

  <button onclick=”generatePyramid()”>Create Pyramid</button>

  <pre id=”pyramidOutput”></pre>

  <script>

    function generatePyramid() {

      var n = document.getElementById(“rows”).value;

      var pyramid = “”;

 

      for (var i = 1; i <= n; i++) {

        var spaces = ” “.repeat(n – i);

        var stars = “*”.repeat(2 * i – 1);

        pyramid += spaces + stars + “\n”;

      }

      document.getElementById(“pyramidOutput”).textContent = pyramid;

    }

  </script>

</body>

</html>