Über Web, Tech, Games, Art,
Code & Design

Alle Beiträge zum Thema "JavaScript"

30. April 2024

So erstellst du eine Offline-WebApp (PWA)

Um aus einer Website eine WebApp zu generieren, die auch offline funktioniert, sind 3 Dateien essentiell: „index.html“, „manifest.json“ und der Service-Worker „serviceworker.js“. (Die Dateinamen sind frei wählbar.) In den jeweiligen Files wird folgender Code benötigt: Im HTML: manifest.json serviceworker.js Um auf die WebApp hinzuweisen, kann folgenden Script ebenfalls hilfreich sein:add-to-homescreen.js CSS für iPhone-Notch Damit die […]

24. April 2024

add-to-Homescreen.js

Mit dem JavaScript „add-to-Homescreen.js“ wird ein kleines Info-Fenster eingeblendet, das dazu auffordert, die aktuelle Website auf dem HomeScreen abzulegen. Zur Zeit noch iOS-only. Download add-to-homescreen.zip

26. Februar 2024

Mit node.js JavaScript-generierte Inhalte scrapen

Eine etwas unkonventionelle Lösung habe ich mit für folgendes Problem überlegt. Für einen Kunden scrape ich automatisiert bestimmte Inhalte diverser Websites. Problem Nr. 1: Inzwischen werden viele Inhalte erst im Client-seitig mit JavaScript generiert. Das macht es unmöglich sie mit PHP zu crawlen. Auf der Suche nach einer Lösung stößt man schnell auf „node.js“ & […]

13. Februar 2024

Kalender mit Monatsübersicht (mit Bootstrap & jQuery und optional mit WordPress)

Bei der Suche nach einem schlichten, schicken Kalender mit Monatsansicht, bin ich auf folgendes Template aufmerksam geworden: https://github.com/ylli2000/bootstrap-4-calendar Der Kalender sieht nicht nur sehr schick aus, er ist auch sehr leicht mit Terminen zu befüllen, zu konfigurieren und anzupassen. Termine können ganz einfach mit einem Array in den Kalender eingetragen werden: Solch ein Array lässt […]

21. Januar 2024

Location Based Content und QR-Codes

Mit der Geolocation API kannst du den Standort des Users ermitteln. Diese API lässt sich durchaus auch kreativ einsetzen. So können z.B. basierend auf dem Standort des Users bestimmte Informationen und Funktionen angezeigt werden. Z.B.: All diese Beispiele lassen sich ideal mit einem QR-Code nutzen, der an entsprechendem Ort angebracht ist. Folgender Code kann als Basis für […]

30. Dezember 2023

CSS 100vw und das Problem mit der Scrollbar

Die Einheit „vw“ („Viewport Width“) ist sehr praktisch, wenn man ein Element mit CSS bildschirmfüllend darstellen möchte. Das Problem hierbei ist, dass die Scrollbars im Browser, je nach Einstellung und Betriebssystem, automatisch ein- und ausgelblendet werden oder die ganze Zeit sichtbar sind. Dieser Umstand ist im dynamischen Wert „vw“ leider nicht berücksichtigt. Und so kommt […]

27. Dezember 2023

So kannst du das Laden von gecachtem JavaScript und CSS verhindern

Dass JavaScript und CSS-Dateien nach einer Änderung im Browser nicht neu geladen, sondern aus dem Cache geladen werden, kann eine nervige Angelegenheit sein. Insbesondere auch auf dem iPhone, auf dem kein „Hard Refresh“ möglich ist. Um den Browser anzuweisen, immer die aktuelle JS uns CSS vom Server zu laden, reicht es einen sich ändernden Parameter […]

14. Dezember 2023

Text-Fade-in-Effekt mit CSS und JavaScript

Mit folgendem Snippet lässt sich ein subtiler, schicker Text-Eingangs-Effekt erzielen, der sich insbesondere für große Headlines eignet. Lorem ipsum dolor sit amet constructor Noch mal

1. November 2023

setTimeout() – JavaScript-Code zeitverzögert ausführen

Mit folgendem Code lässt sich JavaScript zeitverzögert ausführen.

9. Oktober 2023

Responsive Text

Im responsive Webdesign wird wird die Schriftgröße in der Regel durch Breakpoints und Mediaqueries angepasst. Z.B. auf kleinen Bildschirmen 14px und auf großen Bildschirmen 22px. Das funktioniert in den meisten Layouts auch sehr gut. Manchmal soll eine Headline aber auch stufenlos skaliert werden. Z.B. wenn sie, wie in diesem Beispiel, genau so breit sein soll, […]
Datenschutz Impressum