Schon vor längerer Zeit wurde mit Chrome 90 ein Feature eingeführt (davor gab es das schon als Extension), mit dem man über Links gleichzeitig einen Teil des verlinkten Textes markieren kann.

Dazu hängt man den zu markierenden Text mit als Fragment in der Form #:~:text= gefolgt vom Text an die URL an. Zum Testen ein Link auf diesen Artikel, der wie folgt gebildet wird: https://arnowelzel.de/a-propos-text-markieren-im-browser#:~:text=Teil%20des%20verlinkten%20Textes.

Beim Testen dieser Funktion habe ich festgestellt, dass die Markierung wieder verschwindet, wenn man eine Seite, die über eine solche URL geladen hat, aktualisiert.

Mein Beispiel für WebGL und der Monitor-Test nutzen zur Darstellung ein Canvas-Element. Zusätzlich ist jeweils die Möglichkeit vorhanden, die Darstellung auf den Vollbild-Modus umzuschalten. Technisch wird das mit dem Fullscreen API realisiert. Die Vorgehensweise ist dabei immer gleich:

1. Wenn der Knopf für den Vollbild-Modus angeklickt wird, wir mit requestFullscreen() das Canvas-Element auf Vollbild-Darstellung umgestellt.
2. Ein Handler, der auf diesen Wechsel reagiert, korrigiert im Vollbild-Modus die Breite und Höhe des Elementes auf die Bildschirm-Größe unter Berücksichtigung der window.devicePixelRatio, damit die native Auflösung des Gerätes verwendet wird.

Weiterlesen →

Aktuelle Versionen von macOS wie auch Windows 10 bieten die Möglichkeit, die Oberfläche des Systems im „Dark Mode“ zu betreiben. In diesem Modus werden Hintergründe von Fenstern werden dunkel dargestellt und Texte hell.

Auch Websites können diese Einstellung mit der CSS-Media-Query prefers-color-scheme: dark unterstützen, indem sie für den „Dark Mode“ ein angepasstes Farbschema verwenden.

Weiterlesen →

Mittlerweile existiert Lightbox mit PhotoSwipe seit über zwei Jahren und hat über 6000 aktive Installationen :-).

Gegenüber der ursprünglichen Version habe ich PhotoSwipe mittlerweile um einige Funktionen erweitert:

1. Eine Endlos-Schleife ist auch mit nur zwei Bildern möglich.
2. Wenn keine Endlos-Schleife aktiv ist, werden die Pfeil-Knöpfe für das nächste oder vorherige Bild beim ersten und beim letzten Bild ausgeblendet.
3. Die Vollbild-Ansicht kann auch mit drücken der Taste „F“ aktiviert werden.
4. Beim Wechsel der Bilder mit den entsprechenden Knöpfen oder den Cursortasten in der Desktop-Ansicht erfolgt der Wechsel mit einer Animation ähnlich der Wischgeste in der mobilen Darstellung.

Darüber ist es jetzt auch möglich, WordPress-Bildergalerien und Gutenberg Galerie-Blöcke in ihrer eigenen Lightbox anzuzeigen.

Die DNS-Abfrage zeigt jetzt auch die Inhalte von CAA-Records (Flag, Tag und Value) an.

Ursprünglich habe ich Lightbox mit PhotoSwipe nur erstellt, um PhotoSwipe überhaupt nutzen zu können. Dabei wurden anfangs manche Möglichkeiten noch gar nicht genutzt.

Weiterlesen →

Bisher habe ich für die vergrößerte Anzeige von Bildern das Plugin „Responsive Lightbox“ verwendet. Leider hatte diese Lösung aber einige Schwächen:

• keine Möglichkeit, die Bildansicht zu vergrößern
• Wisch-Gesten sehr „hakelig“ – man sieht, wie die Bildansicht nur sehr ruckhaft der Fingerbewegung folgt

Besonders die fehlende Möglichkeit der Bildvergrößerung ist mir bei einer anderen Website aufgefallen, wo ich Leute gesehen habe, die auf ihren Smartphones versucht haben, einzelne Bilder mit der üblich Zwei-Finger-Geste zu vergrößeren.

Als Alternative habe ich schließlich PhotoSwipe entdeckt – eine JavaScript-Bibliothek, die nicht nur eine Vergrößerung der Bilder per Mausklick oder Finger-Gesten ermöglicht, sondern auch eine bildschirmfüllende Vollbild-Ansicht. Auch die Reaktion auf Eingaben ist deutlich flüssiger als bei „Responsive Lightbox“.

Weiterlesen →

Die Masche mit pseudo-seriösen „Testberichten“, über die ich vor einigen Monaten geschrieben habe scheint immer noch erfolgreich zu sein – heute gab es schon wieder einen Versuch, eine Website als Kommentarlink bei mir unterzubringen, auf der vermeintliche „Testberichte“ angepriesen werden. Tatsächlich ist das aber nichts anderes als der altbekannte Werbemüll, der dazu verleiten soll, die Links bei Amazon mit Affiliate-Kennzeichnung aufzurufen, damit der Spammer seinen Anteil am Kauf bei Amazon erhält.

Diesmal ging es um AV-Reciever, wobei der Spammer woanders auch noch Subwoofer vertickt und das Bild des vermeintlichen Betreibers, „Julian, 27 Jahre alt“ gleich mehrfach benutzt hat:

Weiterlesen →

Vor kurzem wurde WordPress 4.6 veröffentlicht. Leider gibt es einen kleinen Fehler im Texteditor: wenn man im Inhalt in der „Text“-Ansicht nach unten geht und dann etwas bearbeitet, kann es passieren, dass die Ansicht zurück nach oben springt.

Dieses Fehler ist auch im Trac von WordPress dokumentiert und es gibt bereits eine Lösung dazu, die für die kommenden Version 4.6.1 übernommen wird.