Element

Source Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link
      rel="stylesheet"
      href="https://staging-content-media-cdn.codefinity.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/other-section/cnn-hyperparameters/styles-v2.css"
    />
  </head>
  <body>
    <div class="wrapper">
      <div class="top-right">
        <button id="toggleAnimation">⏸️</button>
      </div>
      <div class="controls">
        <div class="control-group">
          <div class="top-row">
            <label for="inputSize">Input Size:</label>
            <input type="number" id="inputSizeNum" value="5" />
          </div>
          <input type="range" id="inputSize" value="5" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="padding">Padding:</label>
            <input type="number" id="paddingNum" value="0" />
          </div>
          <input type="range" id="padding" value="0" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="kernelSize">Kernel Size:</label>
            <input type="number" id="kernelSizeNum" value="2" />
          </div>
          <input type="range" id="kernelSize" value="2" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="stride">Stride:</label>
            <input type="number" id="strideNum" value="1" />
          </div>
          <input type="range" id="stride" value="1" />
        </div>
      </div>

      <div class="container">
        <div class="grid-container">
          <div class="grid-title js-input-grid-size">Input Grid</div>
          <div class="grid input-grid"></div>
        </div>

        <div class="grid-container">
          <div class="grid-title js-output-grid-size">Output Grid</div>
          <div class="grid output-grid"></div>
        </div>
      </div>
      <p class="text">
        <span style="font-weight: 600">Hover over</span> the matrices to change
        kernel position.
      </p>
    </div>

    <script src="https://staging-content-media-cdn.codefinity.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/other-section/cnn-hyperparameters/script-v1.js"></script>
  </body>
</html>

Spanish

Portuguese

French

German

Ukrainian

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 3

Spør AI

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Suggested prompts:

Can you explain what this HTML code does?

What is the purpose of the controls in the interface?

How does the language change affect the functionality?

Sveip for å vise menyen

Element

Source Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link
      rel="stylesheet"
      href="https://staging-content-media-cdn.codefinity.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/other-section/cnn-hyperparameters/styles-v2.css"
    />
  </head>
  <body>
    <div class="wrapper">
      <div class="top-right">
        <button id="toggleAnimation">⏸️</button>
      </div>
      <div class="controls">
        <div class="control-group">
          <div class="top-row">
            <label for="inputSize">Input Size:</label>
            <input type="number" id="inputSizeNum" value="5" />
          </div>
          <input type="range" id="inputSize" value="5" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="padding">Padding:</label>
            <input type="number" id="paddingNum" value="0" />
          </div>
          <input type="range" id="padding" value="0" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="kernelSize">Kernel Size:</label>
            <input type="number" id="kernelSizeNum" value="2" />
          </div>
          <input type="range" id="kernelSize" value="2" />
        </div>

        <div class="control-group">
          <div class="top-row">
            <label for="stride">Stride:</label>
            <input type="number" id="strideNum" value="1" />
          </div>
          <input type="range" id="stride" value="1" />
        </div>
      </div>

      <div class="container">
        <div class="grid-container">
          <div class="grid-title js-input-grid-size">Input Grid</div>
          <div class="grid input-grid"></div>
        </div>

        <div class="grid-container">
          <div class="grid-title js-output-grid-size">Output Grid</div>
          <div class="grid output-grid"></div>
        </div>
      </div>
      <p class="text">
        <span style="font-weight: 600">Hover over</span> the matrices to change
        kernel position.
      </p>
    </div>

    <script src="https://staging-content-media-cdn.codefinity.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/other-section/cnn-hyperparameters/script-v1.js"></script>
  </body>
</html>

CNN Hyperparameters

Element

Source Code

Spanish

Portuguese

French

German

Ukrainian

Awesome!

CNN Hyperparameters

Element

Source Code

Spanish

Portuguese

French

German

Ukrainian