25 April, 2023

So kannst du Push-Mitteilungen von deiner Website versenden

Push-Mitteilungen oder Browser-Benachrichtigungen sind eine coole Möglichkeit die User einer Website auch dann zu erreichen, wenn sie gerade nicht auf der Website sind. Push-Nachrichten funktionieren in allen aktuellen Desktop-Browsern, auf Android-Smartphones und seit April 2023 auch endlich auf iOS (iOS 16.4) – allerdings mit einer Einschränkung: Die Website muss als WebApp „installiert“ sein. Beispiele für […]

• Google
• JavaScript

31 März, 2023

Nur bestimmte Wörter trennen

Die CSS-Silbentrennung (hyphens: auto) ist gleichzeitig Fluch & Segen. Einerseits ist es praktisch und vermeidet, gerade bei schmalen Textspalten, größere Lücken im Text, andererseits entstehen oft sehr merkwürdige Trennungen. Inzwischen deaktiviere ich auf vielen Websites schon wieder die automatische Silbentrennung, da viele Kunden die Trennungen als störend empfinden. In manchen Situationen, besonders bei großen Headlines […]

• CSS
• HTML
• JavaScript

28 März, 2023

Einfache Zeitsteuerung mit JavaScript oder PHP

Mit folgenden Codes kann man ein div oder andere Elemente einfach zeitgesteuert einblenden: Oder das Ganze in PHP:

• JavaScript
• PHP

24 März, 2023

jQuery Count up

Mit folgendem jQuery-Script wird von 0 bis zu einer definierten Zahl hochgezählt, sobald die Zahl auf dem Bildschirm zu sehen ist.

• JavaScript
• jQuery

22 März, 2023

Integration eines QR-Code-Scanners in eine Web-Anwendung

Mit folgender JavaScript-Library lassen sich QR-Codes scannen und interpretieren – sowohl auf einem Smartphone, als auch an einem Desktop-Rechner. Das ganze passiert Client-seitig und erfordert nur ein winzig kleines JavaScript (< 60 kb). Das ist nicht nur aus technischer Sicht sehr beeindruckend. https://github.com/nimiq/qr-scanner Da es sehr einfach in Anwendungen integrierbar ist, eröffnet diese Library fantastische […]

• JavaScript
• QR-Codes

20 März, 2023

Formulareingaben lokal speichern

Mit folgendem JavaScript/jQuery-Code lassen sich Formulareingaben lokal speichern und müssen somit beim nächsten Aufruf der Seite nicht erneut eingegeben werden. Demo: Vorname Name Dieser Code sollte logischerweise nicht für sensible Daten oder Passwörter genutzt werden, da die Daten im Klartext im localStorage des Browsers gespeichert werden.

• HTML
• JavaScript
• jQuery

19 März, 2023

ImageResizer

Heute habe ich ein Tool fertig gestellt, dass ich schon seit Jahren im Kopf habe, in der täglichen Arbeit oft vermisst habe, aber bis jetzt nie umgesetzt habe: ImageResizer Mit ImageResizer kann die Größe von Bildern (jpgs & pngs) in Sekundenschnelle angepasst werden. Die Neuberechnung der Bilder findet lokal im Browser statt. Es werden keine […]

• JavaScript

15 März, 2023

Design- und Code-Inspiration: Die Code-Pens von Gayane Gasparyan

Vielleicht nicht alles alltags-tauglich, aber definitiv sehr inspirierend sind die Code-Pens auf folgender Seite: https://codepen.io/gayane-gasparyan/pens/showcase

• CSS
• Design
• JavaScript

26 Februar, 2023

QR-Code-Generator

Hier habe ich einen QR-Code-Generator gebaut, der auf Basis des jQuery-Plug-ins „jquery.qrcode.js“ funktiert. Schnell, schlank, schön. www.fbnfrtg.de/tools/qr-generator/

• JavaScript
• jQuery

26 Februar, 2023

Bestimmte Wörter NICHT trennen.

Mit der Einführung von CSS3 vor einigen Jahren war es endlich möglich lange Wörter in Texten automatisch trennen zu lassen. Häufig führt diese Funktion jedoch zu unerwünschten Ergebnissen, insbesondere wenn z.B. Markennamen getrennt werden, die nicht getrennt werden sollen. Das lässt sich mit folgendem JavaScript (& CSS) einfach verhindern:

• CSS
• JavaScript