HTML5 – die besten Beiträge

Wenn ich auf den Slider klicke, dann scrollt es danach nicht mehr nach unten, sondern geht automatisch nach oben. Woran könnte das Problem liegen?

HTML:

<article id="ÜberschriftAnfang">
  <h1>Michael Jackson - The King of Pop</h1>
  
  <!-- Slideshow Container -->
  <div class="slideshow-container">
   
    <!-- Slide 1 -->
    <div class="mySlides fade active" style="display:block">
      <div class="numbertext">1 / 3</div>
      <img src="Background picture.jpg" style="width:100%" alt="Background Image">
    </div>

    <!-- Slide 2 -->
    <div class="mySlides fade">
      <div class="numbertext">2 / 3</div>
      <img src="papers.co.jpg" style="width:100%" alt="Background Image 2">
    </div>

    <!-- Slide 3 -->
    <div class="mySlides fade">
      <div class="numbertext">3 / 3</div>
      <img src="5m6XCzF.jpg" style="width:100%" alt="Background Image 3">
    </div>

    <!-- Navigation Arrows -->
    <a class="prev" onclick="plusSlides(-1)">❮</a>
    <a class="next" onclick="plusSlides(1)">❯</a>

  </div>

  <!-- Dots Navigation -->
  <div style="text-align:center">
    <span class="dot" onclick="currentSlide(1)"></span>
    <span class="dot" onclick="currentSlide(2)"></span>
    <span class="dot" onclick="currentSlide(3)"></span>
  </div>
</article>

JS:

let slideIndex = 1;
showSlides(slideIndex); // Startet die Slideshow und zeigt das erste Bild an.

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  let i;
  let slides = document.getElementsByClassName("mySlides");
  let dots = document.getElementsByClassName("dot");

  // Überprüfen, ob der slideIndex größer als die Anzahl der Slides ist
  if (n > slides.length) {
    slideIndex = 1; // Setze den Index auf 1, wenn er größer ist als die Anzahl der Slides
  }

  // Überprüfen, ob der slideIndex kleiner als 1 ist
  if (n < 1) {
    slideIndex = slides.length; // Setze den Index auf die letzte Slide, wenn er kleiner ist als 1
  }

  // Alle Slides ausblenden
  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";
  }

  // Alle Dots zurücksetzen
  for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" active", "");
  }

  // Zeige das aktuelle Bild und Dot
  slides[slideIndex - 1].style.display = "block";  
  dots[slideIndex - 1].className += " active";
}

CSS: siehe Antwort

Hallo, ich möchte wissen, ob Gutefrage.net irgendeine bestimmte Klasse oder id für das Element, auf dem die frage zu sehen ist hat, das gleiche auch für die Antworten.

Ich will gerade Pyhon lernen fürs Backend meiner Webseite, dazu MySQL.

Ich habe jetzt mit html und css eine login page, eine registration page und eine main page erstellt. Ich habe mit Hilfe von KI dann es so programmiert, dass daten die auf der registration page eingegeben werden, in einer Datenbank speichern und mit denen man sich dann auf der login page einloggen kann, um auf die main page zu gelangen.

Den Python Code habe ich mithilfe von KI erstellt. Jetzt meine Frage, wie lerne ich selber solchen Code zu schreiben. Ich kenne mich nur mkt Frontend aus, aber Backend ist abstrakter.

Hallo, warum wird meine Webseite mal geladen mit css und Bildern, und mal nicht? Woran liegt das? Kann mir jemand helfen?

Hallo kann mir jemand sagen, wie ich meine Webseite selber hosten kann und dsgvo konform das es auch sicher ist ? noch nix gefunden außer GitHub Pages da weiss ich nicht genau wies geht danke im voraus

Hi, kurze Frage:

Wie kann ich den Benutzernamen bei Webtrees auf jeder Seite in der Menüleiste einblenden?

Hab versucht das Feld vom Benutzer (Bearbeitung) zu benutzen.

Aber da gibt er im Menü nichts aus. Der kann wahrscheinlich nicht auf die Daten zugreifen.

Welche Variable muss ich wie benutzen?

Jemand ne Idee?

Moin, kennt sich vielleicht jemand mit PHP und Html aus und weiß warum beim Upload der Datei nicht das Script "upload.php" ausgeführt wird? Versuche mich gerade beim Scripten, stehe allerdings gerade voll auf dem Schlauch... Danke!

<?php include 'header.php'; ?>
<?php
if(!isset($_SESSION['email'])){
  header('location:login.php');
  $target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
}
 ?>
      <div class="breadcrumb">
        <div class="container">
            <a class="breadcrumb-item" href="index.php">Home</a>
            <span class="breadcrumb-item active">Welecome <?php echo $_SESSION['email'] ?></span>
            <span class="breadcrumb-item active">Upload Video</span>
        </div>
    </div>
    <section class="static about-sec">
        <div class="container">
            <h1>Upload Video</h1>
            <div class="form">
                <form class="" action="videoUpload.php" method="post">
                    <div class="row">
                        <div class="col-md-6">
                            <input type="hidden" name="id" value="">
                            <label for="name">Name of Video:</label>
                            <input type="text" name="name" value="" placeholder="Fantasy World" required>
                            <label for="video_url">Video URL</label>
                            <input type="file" name="video_url" required>
                            <label for="description">Description</label>
                            <input type="text" name="description" value="" placeholder="">
                            <label for="category">Category</label>
                            <select name="category">
                              <option value="Classic">Classic</option>
                              <option value="Adventerous">Adventerous</option>
                              <option value="Nature">Nature</option>
                              <option value="Others">Others</option>
                            </select>
                          </div>
                        </div>
							<div class="col-lg-8 col-md-12">
							<form action="upload.php" method="post" enctype="multipart/form-data">
							<input type="submit" class="btn black" value="Upload Image" name="submit">
							</form>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </section>


    <?php include 'footer.php';?>

Warum kosten Webseiten oft mehr, die auf HTML basieren und nicht via WordPress gemacht wurden?

Hallo zusammen wo lernt mann am Besten JavaScript auf windows. Bin relativ neu Einsteiger. Das program muss nicht Gratis sein, aber auch nicht all zu viel Kosten, ich lege ein Budget von 20euro und am beste wen es eine Applikation zum Herunterladen ist und nicht ein Kurs VORESRST

Also. Ich behersche relativ gut HTML und CSS. JavaScript kann ich einigermaßen.

Ich bin 21 Jahre alt. Wie werde ich zum absoluter Pro-Programmierer?

Mein Plan:

JavaScript gut beherschen und fürs Backend Python lernen. Dazu irgendwann Frameworks wie React Native lernen. MySQL für Datenbanken, usw..

Ich will die absolute Maschine werden, was das angeht.

Wie mache ich das?

Hallo,

ich benutze VS Code und baue gerade meine Webseite. Jedoch kommen im HTML Code immer unnütze Fehler, die nerven. z. B. bei einem Link (also <a></a>) muss angeblich immer ein aria-label definiert sein, oder inputs müssen immer ein label haben, oder bei img muss immer alt definiert sein, oder man darf angeblich den Style nicht direkt in den tag schreiben.

Bei anderen Ordnern ist das aber nicht so.(bzw. auf anderen Geräten). Ich hab meine Webseite mit Firebase gehostet. Es war zwar mal eine Zeit weg, aber nachdem ich .hintrc gelöscht und wieder neu eingefügt habe, kommen jetzt immer solche nervigen Error, die ja nicht wirklich wichtig sind.

Kann man das irgendwie ausschalten?

Man kann mit bestimmten Tools ganze Webseiten kopieren und für sich selber nutzen, wenn mab nicht alles selber designen will. Findet ihr das unethisch? Ist das verboten?

Guten Tag,

Ich würde gerne den Text c Lukas Kahler an die untere linke Seite mit Flexbox verschieben.

Im Internet stand das ich mal align-items: flex-end; Probieren soll dies hat jedoch nicht mit Erfolg geklappt, da ich noch neu in der Webentwicklung bin, wollte ich fragen wie ihr diese Aufgabe lösen würdet?

Viele Grüße

Hallo zusammen,

ich bitte euch um Hilfe bei meinem Problem. Und zwar muss ich im Studium eine Seite so nachbauen, dass ich mittels einer Filterauswahl eine Liste ausgeben kann.

Letztens haben wir gelernt, dass wir den Code anhand Komponenten aufteilen sollen. Ich habe also die Komponenten Titelleiste (wo der Filter, Logo und Titel enthalten sein sollte), Tabelle und Filter erstellt.

Zudem gibt es ja diese Hauptdatei App.js. In einem ersten Schritt habe ich in der Filter.js Funktionen geschrieben, um meine Daten gemäß der möglichen Suchbegriffe zu filtern und habe den aktuellen Wert, welcher vom Nutzer gewählt wird, in einem useState abgespeichert.

Wie kann ich diesen Wert nun der Tabelle.js übergeben, damit dort anhand der Filterung die Ausgabe generiert werden kann?

ChatGPT hat mir geraten, die Daten zuerst in die App.js zu schreiben. Aber wie geht das? Wie komme ich von einem Child in das Parent?

Ich denke, ihr erkennt, dass ich leider noch sehr unerfahren im Programmieren bin.

Folgend die Codes:

App.js:

const Titelseite = () => {
  return (
    <div className="titelseite-container">
      <BasicTable />
    </div>
  );
};

const Tabelle = () => {
  return (
    <div className="tabelle">
      <div>Tabellenleiste</div>
    </div>
  );
};

function App() {
  const [service_ausg, setService] = useState("");
  const [anbieter_ausg, setAnbieter] = useState("");
  const handleServiceChange = (value) => {
    setService(value);
  };
  const handleAnbieterChange = (e) => {
    setAnbieter(e);
  };

  return (
    <div className="App">
      <Titelleiste>
        <Filter
          onChangeService={handleServiceChange}
          onChangeAnbieter={handleAnbieterChange}
        />
        <BasicTable />
      </Titelleiste>
      <Titelseite />
    </div>
  );
}

export default App;

Titelleiste.js:

import Grid from "@mui/material/Grid2";
import { Filter } from "./Filter";
import { useState } from "react";
import data from "./data/tableData.json";

export const Titelleiste = () => {
  const getData = (data) => {
    console.log("Ich bin in Titelleiste und komme von Filter");
  };

  return (
    <Grid container spacing={2}>
      <Grid item size={4}>
        <p>
          <img src="geoharvester.png" width="100px" height="50px" />
        </p>
      </Grid>
      <Grid item size={4}>
        <p>Ein Katalog für schweizer Geodienste</p>
      </Grid>
      <Grid item size={4} container justifyContent="flex-end">
        <p>
          <Filter onChange={getData} />
        </p>
      </Grid>
    </Grid>
  );
};

Filter.js :

import "./App.css";
import { useState } from "react";
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
import FormHelperText from "@mui/material/FormHelperText";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
import data from "./data/tableData.json";
import { App } from "./App";

export const Filter = ({ onChangeService, onChangeAnbieter }) => {
  let array_service = data.map((element) => element.service);
  let array_service_ausg = [...new Set(array_service)]; //* new "Set", entfernt automatisch die Duplikate und erstellt ein neues Objekt. Das neue Objekt wird mittels den "..." in eine Liste gespeichert
  let array_anbieter = data.map((element) => element.anbieter);
  let array_anbieter_ausg = [...new Set(array_anbieter)];
  const funService = (e) => {
    const [service_ausg, setService] = useState("");
    setService(e.target.value);
  };
  const funAnbieter = (e) => {
    TransferAnbieter(e.target.value);
  };

  return (
    <div>
      <form>
        <Select name="service" onChange={funService} sx={{ width: 100 }}>
          {array_service_ausg.map((service) => (
            <MenuItem value={service}>{service}</MenuItem>
          ))}
        </Select>
      </form>
      <Select name="anbieter" onChange={funAnbieter} sx={{ width: 100 }}>
        {array_anbieter_ausg.map((anbieter) => (
          <MenuItem value={anbieter}>{anbieter}</MenuItem>
        ))}
      </Select>
      <br />
    </div>
  );
};

Nach einigen Stunden, die ich bereits in die Recherche meines Problems investiert habe, danke ich euch herzlich für eure Hilfe.

Kann ich ne Webseite mit HTML CSS und java, erstellt selber Zuhause auf mein rassberry Posten ich mein damit , ohne weitere Kosten die Server Adresse kostenlos mit Dyn DNS umwandeln usw kennt sich jemand aus kann helfen?

In HTML gecoded. Geht das?

bin ziemlich eingerostet, weil ich schon seit einigen Jahren kein Javascript mehr verwendet habe.....

muss einfach nur 180 Sekunden runter zählen und soll dann einmalig einen Iframe öffnen.

Wie kann ich es so machen, dass man zu einer id weitergeleitet wird, sobald man scrollt? Also so eine Scrollhilfe, die den User auf die nächste Sektion smooth weiterleitet, beim ersten mal Scrollen? Mit JavaScript

Hallo ich suche eine CMS welches eine LogIn Seite anzeigt und dann erst per Code Eingabe die Seite öffnet. Dabei soll der LogIn getrackt werden, es soll keine Community sein sondern nur eine Seite mit Statischen Inhalten, die aber möglichst einfach um neue LogIns ergänzt werden kann, Gibts da eine Out of the Box Lösung?

Danke und LG

Hey, ich möchte bei dem Hintergrund meiner Website ein Hintergrundbild einfügen. Für gewöhnlich sollte das doch funktionieren, aber irgendwie macht es nichts.

Mein Informatiklehrer konnte den Grund auch nicht ausfündig machen.

Kann mir jemand dabei vielleicht weiterhelfen?

Hier mein CSS-Programmtext:

body { 
 text-align:center;
ol {
   list-style-type: decimal;
} 
.rot {
   color: red;
}
.grün {
   color: green;
}
.blau {
   color: blue;
}
.gelb {
   color: yellow;
}
 
.main{ 
 background-size:cover;
 justify-content:center;
 align-items:center;
 text-align: center;
 background-image:url("https://th.bing.com/th/id/OIP.54aDRJHlX7jC15ANjLWg-QHaEo?rs=1&pid=ImgDetMain")
}