QuackBrick
New member
Hab diverse Vorlagen ausprobiert, nichts funzt, ist das in den Browsern deaktiviert worden?
Greetz
Greetz
[FRAGE] Vollbild per JS unterbunden?
- Ersteller QuackBrick
- Erstellt am
QuackBrick
New member
Ouh, da fände man in meiner Chronik nun etwa 60 Seiten. Vor allem jene welche auf Stackoverflow zu finden waren, und solche, die es auf deutschsprachigen (ausführlichen) Seiten gab. Aber die waren alle so von vor 2013,deswegen dachte ixh, dass ab dann unterbunden wurde. Jetzt ist mir aber gerade in Sinn gekommen, Youtube gehts ja noch immer.
QuackBrick
New member
Also nur rasch als Beispiel, das hier von selfhtml (aus 2017!) gibt bei mir nur einen schwarzen Screen, statt dass das Bild im Vollbildmodus angezeigt wird.
https://wiki.selfhtml.org/index.php?title=JavaScript/Fullscreen&oldid=52590
https://wiki.selfhtml.org/index.php?title=JavaScript/Fullscreen&oldid=52590
kkapsner
Super Moderator
Code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
</head>
<body>
<img id="compass" src="https://upload.wikimedia.org/wikipedia/de/b/b9/Kompass.jpg" width="200">
<script type="text/javascript">
document.getElementById("compass").addEventListener("click", function(ev){
(this.requestFullscreen || this.mozRequestFullScreen || this.webkitRequestFullScreen || this.msRequestFullScreen).call(this);
});
</script>
</body>
</html>QuackBrick
New member
Bei mir tut des immer noch nicht, vielleicht liegts ja auch nur an meinen aktvierten Add-Ins (normalerweise JS deaktiviert, und nur wo nötig aktiviert, obschon da logischerweise JS aktiviert ist).
Eingebettete Frames - Webkompetenz
Damit hats jetzt getan, jetzt hab ich nen link, den ich einfach ganz normal stylen kann.
Eingebettete Frames - Webkompetenz
Damit hats jetzt getan, jetzt hab ich nen link, den ich einfach ganz normal stylen kann.
QuackBrick
New member
Etwas bessere Methode (aus meiner "kein Plan wie das nun aber eigentlich funzt"-Sicht)
Vorteil gegenüber oben stehender:
Alles bleibt an Ort und Stelle! CSS muss nicht alles mit :fullscreen ergänzt werden.
Lässt sich mit 2. Klick auf den Button einfach wieder beenden.
Code:
<a type="button" value="click to toggle fullscreen" onclick="toggleFullScreen()" style="text-decoration: none;">
<button>
Vollbild
</button>
</a>
<script type="text/javascript">
function toggleFullScreen() {
if ((document.fullScreenElement && document.fullScreenElement !== null) ||
(!document.mozFullScreen && !document.webkitIsFullScreen)) {
if (document.documentElement.requestFullScreen) {
document.documentElement.requestFullScreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullScreen) {
document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}
}
</script>Vorteil gegenüber oben stehender:
Alles bleibt an Ort und Stelle! CSS muss nicht alles mit :fullscreen ergänzt werden.
Lässt sich mit 2. Klick auf den Button einfach wieder beenden.
Anhänge
Zuletzt bearbeitet:
QuackBrick
New member
Auf dem handy leider nicht, und beim hochscrollen hört dann eben immer der Vollbildmodus auf, so wie es jetzt ist nicht, sondern erst durch erneutes klicken, oder durch die zurück taste.