JavaScript - In den Vollbild-Modus umschalten

Dies wird ein Vollbild


<style>

div#fullscreen {
 
background-imageurl("hintergrund.jpg");
 
padding25px;
}

div.title {
 
colorOrangered;
}

button#button {
 
background-colorLightblue;
 
width250px;
 
borderSolid 1px Silver;
 
transitionbackground-color 0.5s;
}

button#button:hover {
 
cursorPointer;
 
background-colorLightskyblue;
}
</
style>

<
div id="fullscreen">
 <
div class="title">Dies wird ein Vollbild</div>
 <
p><button type="button" id="button">Vollbild umschalten</button></p>
</
div>

<
script>
let fullscreen document.querySelector("#fullscreen");
let button document.querySelector("#button");

button.addEventListener("click", () => {
 if (!
document.fullscreenElement) {
  
fullscreen?.requestFullscreen();
  } else {
  
document.exitFullscreen();
 }
});
</
script>

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Bausteinen (Codeschnipsel) aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<rp> Ruby Anmerkung

CSS - Bild vergrößern mit dem „Checkbox Hack”

PHP - PHP-Version überprüfen

JavaScript - Lichtregler

MySQL - Datensätze einer Tabelle zählen