was ist hier falsch gelaufen?
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Rocket vs Aliens</title>
  <style>
    canvas {
      background-color: gray;
    }
    
  </style>
  <script>
    let KEY_SPACE = false;
    let KEY_UP = false;
    let KEY_DOWN = false;
    let canvas;
    let ctx;
    let backgroundImage = new Image();
    let rocket = {
      x: 100,
      y: 200,
      width: 200,
      height: 80,
      src: 'img/rocket.png'
    };
    let spaceship = {
      x: 500,
      y: 200,
      width: 100,
      height: 40,
      src: 'img/spaceship.png'
    };
    document.onkeydown = function(e) {
      if (e.keyCode ==32) { // Leertaste gedrückt
        KEY_SPACE = true;
      }
      if (e.keyCode ==32) { // unten gedrückt
        KEY_SPACE = true;
      }
    
      if (e.keyCode ==38) { // Oben gedrückt
        KEY_UP = true;
      }
    }
    document.onkeyup = function(e) {
      if (e.keyCode ==32) { // Leertaste losgelassen
        KEY_SPACE = false;
      }
    
      if (e.keyCode ==38) { // oben losgelassen
        KEY_UP = false;
      }
      if (e.keyCode ==40) { // unten losgelassen
        KEY_DOWN = false;
      }
    }
    function startGame () {
      canvas = document.getElementById('canvas');
       ctx = canvas.getContext('2d');
      loadImages();
      draw();
      // calculate
    }
    function loadImages() {
      backgroundImage.src = 'img/background.png';
      rocket.img = new Image();
      rocket.img.src = rocket.src;
      spaceship.img = new Image();
      spaceship.img.src = spaceship.src;
    }
    function draw() {
      ctx.drawImage(backgroundImage, 0, 0);
      ctx.drawImage(rocket.img, rocket.x, rocket.y, rocket.widht, rocket.height);
      
      requestAnimationFrame(draw);
    }
  </script>
</head>
<body onload="startGame()">
<canvas id="canvas" width="720" height="480"></canvas>
</body>
</html>
HTML, Webseite, CSS, JavaScript, HTML5, Programmiersprache, Webentwicklung
HTML input ausgeben?

Hallo Community,

ich habe einen Code für eine Webseite mit HTML geschrieben.

Nun ist es so, das ich den input von vier Feldern, welche sich oben auf der Webseite befinden, unten auf der Webseite angezeigt haben möchte. Ich habe schon viele Möglichkeiten im Internet gefunden, aber keine wollte so richtig funktionieren. Kann mir hier jemand bei meinem Problem helfen?

Bei dem Code kann ich euch nur einen Ausschnitt, nämlich den mit den betreffenden Teilen reinschicken, da die Frage sonst zu lang ist.

MfG Kuchenmonster31

Teilcode:

Feedbackwebsite
<form class="Formular" action="datenbank für website.py" method="post">
  Vorname:
  <input type="text" name="vorname" size="30" maxlength="50">
</form>
<!-- Nachname -->
<form class="Formular" action="datenbank für website.py" method="post">
  Nachname:
  <input type="text" name="nachname" size="30" maxlength="50">
</form>
<!-- Fedback für Coding School -->
<form class="Formular" action="datenbank für website.py" method="post">
  Feedback für die<br> Coding School:
  <textarea type="text" name="vorname" size="30" maxlength="1000"></textarea>
</form>
<!-- Feedback für Website -->
<form class="Formular" action="datenbank für website.py" method="post">
  Anmerkung zur <br> Website:
  <textarea type="text" name="vorname" size="30" maxlength="1000"></textarea>
</form>
<!-- Button damit die eingabe unten auf der Website angezeigt wird: -->
<button class="Button">Formular abschicken</button>
<h4 class="Ausgabe">Ausgabe:</h4>
HTML, Webseite, programmieren, CSS, Webdesign, Webentwicklung
Javascript kleiner mache?
            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox.dispatchEvent(new Event('change'));
                }
            });


            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox1.dispatchEvent(new Event('change'));
                }
            });


            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox2.dispatchEvent(new Event('change'));
                }
            });


            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox3.dispatchEvent(new Event('change'));
                }
            });


            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox4.dispatchEvent(new Event('change'));
                }
            });


            $("[data-group]").click(function () {
                if ($(this).prop('checked')) {
                    $('[data-group="' + $(this).data('group') + '"]').prop('checked', '');
                    $(this).prop('checked', 'checked');
                    otherCheckbox5.dispatchEvent(new Event('change'));
                }
            });
HTML, JavaScript, JQuery, PHP
Html Sticky header funktioniert nicht?

Hallo, seit Weile arbeite ich an einer Website, für welche ich jetzt einen Header installiere. Oben ist etwas Content und danach ist eben der Header, der beim Scrollen oben am Rand bleiben soll. Das ist mein Code dazu, ich hoffe jemand kann mir helfen und danke im Vorraus.

------HTML------

<div id="header">
    <img src="bilder/Logo.png" alt="Logo Fliesen"></img>
         <div id="flexbox">
             <nav>
                 <ul class="menu">
                     <div class="flexitem" id="navFlex">
                        <li><a href="index.html">Home</a></li>
                        <li><a href="engagement.html">Unser Engagement</a></li>
                        <li><a href="contact.html">Kontakt</a></li>
                        <li><a href="about.html">Über mich</a></li>
                        <li><a href="referenzen.html">Referenzen</a></li>
                    </div>
                </ul>
            </nav>
       </div>
   <div class="social" class="flexitem"></div>
</div>

-----CSS------

#header {
    height: 80px;
    left: 0;
    right: 0;
    width: 100vw;
    border-bottom: 1px solid #DEDCD9;
    background-color: white;
    display: flex;
    overflow: hidden;
    position: sticky;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
}
  
  .sticky + #bsp {
    padding-top: 60px;
}

------Script-------

<script>window.onscroll = function() {stickyH()};

var navbar = document.getElementById("header");
var sticky = navbar.offsetTop;
function stickyH() {
   if (window.pageYOffset >= sticky) {
       navbar.classList.add("sticky")
        } else {
                navbar.classList.remove("sticky");
              }
            } 
</script>
HTML, Webseite, CSS, HTML5, Code, Webdesign, Webentwicklung, Frontend
Wie kann ich auf Google Sites Anker ohne Inhaltsverzeichnis erstellen?

Hallo,

ich bin verzweifelt. Ich versuche auf einer Seite in Google Sites einen Anker auf den Bereich einer anderen Seite zu erstellen. Soweit, so offensichtlich (mag man behaupten). Ich habe schon mal über den Quellcode herausgefunden, dass Sites automatisch jedem Bereich der Seite ein id-Attribut zuordnet, was die Sache ja in der Theorie vereinfachen sollte. Aber wenn ich einen Link erstelle, werden nur vollständige URLs akzeptiert, keine Anker-Links (ich glaube, nicht mal interne Links auf der selben Websites würden funktionieren). Gut: dachte ich mir, gehe ich den Umweg und setze halt die vollständige URL davor, muss halt die Seite beim Klick drauf notgedrungen neu geladen werden. Dann kam das nächste Problem: die Links werden immer voreingestellt in neuen Tabs geöffnet. Was bitte soll das? Ich brauche schon gar keinen neuen Tab, wenn ich doch ursprünglich nicht einmal die Seite neu aufrufen wollte.

Nun, jetzt mag man ja noch kreativ genug sein, und extra ein Seitenelement anlegen, um HTML selber einzufügen (das geht nämlich auch nicht in einem normalen Textelement, das muss extra angelegt werden). Weiter geht das Drama: HTML-Code wird nicht einfach in die bestehende Seite hinzugefügt, sondern über ein Iframe eingebunden (Geht's noch? Welchen Zweck hat es, HTML extra über ein Iframe einzubinden?).

Kann mir jemand erklären, was das alles soll? Ich weiß, Google Sites richtet sich eher an einfache Baukastenersteller, die sich nicht so für die einfachsten Grundlagen von Webentwicklung interessieren. Aber ernsthaft, direkt HTML in einer Seite einbauen zu können und Ankerlinks zu setzen gehören doch nun zu den primitivsten Basics, eine Webseite zu erstellen. Es scheint so, als wäre das so einfach, dass es schon wieder maßlos kompliziert ist. Geht das überhaupt?

Gut, bevor ich mich über das allererste Google-Produkt weiter aufrege, dass mich echt enttäuscht hat, wenn es da keine Lösung für gibt: weiß jemand, wie man das Problem angehen kann? Und gibt es irgendwo eine versteckte Funktion, einen erweiterten Editor zum Vorschein zu bringen, der etwas professionelleres Arbeiten ermöglicht? Ich brauche doch nur eine sehr simple Webseite mit etwas Text und einem Google Formular. Das darf doch nicht für einen Webbaukasten, der mit einem „professionellen Aussehen“ wirbt, so schwer sein.

PS: Ja, man kann Verknüpfungen über das Inhaltsverzeichnis erstellen. Aber ich brauche diese im Fließtext.

Datenschutz, Google, HTML, Webseite, Recht, HTML5, Medienrecht, Webentwicklung, Google Sites, DSGVO
wie ist mein HTML Projekt?

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

</head>

<style>

</style>

<body>

<H1>Willkommen auf meiner ersten Seite</H1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet, minima rem maiores molestiae possimus sunt aperiam blanditiis. Veritatis impedit rerum, corrupti debitis veniam maxime deleniti, atque earum, aspernatur iure voluptate. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aperiam tenetur ratione mollitia velit, quasi blanditiis ipsa amet magnam doloremque quam quod porro voluptatibus. Voluptate ipsa ratione maxime labore quo veniam?</p>

<input type="text" value=""> <input type="text" value="">

<button>login</button>

<h1>Was erwartet sie hier auf der seite?</h1>

<p>Auf dieser seite erhalten sie hilfe von unseren Fachleuten aus der pychologie <hr>wir arbeiten seit 30 Jahren mit unseren team und haben menschen aus der

Krise geholfen

</p>

<img src="/Users/alexander/Downloads/pexels-cottonbro-4101143.jpg" alt="pexels-cottonbro-4101143.jpg">

<p>in unserer 1 stunden Therapie versuchen wir auf den grund ihre schweren <br>depression zu finden</p>

<footer>

<hr>

<a class="mylink" href="#">Impressum</a>

<a class="mylink" href="#">Kontakt</a>

<a class="mylink" href="#">Datenschutz</a>

<a class="mylink" href="#">Über uns</a>

</footer>

</body>

</html>

Bild zu Frage
Computer, HTML

Meistgelesene Fragen zum Thema HTML