de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Erstellen Sie benutzerdefinierte Responsive Fortschrittsbalken mit ProgressBar.js

Fortschrittsbalken sind den meisten Benutzern im Internet bekannt. Für Entwickler ist es oft ein komplizierter Prozess , einen Fortschrittsbalken von Grund auf neu zu erstellen . Aber mit ProgressBar.js müssen Sie nicht!

Diese freie Open-Source-Bibliothek hat keine Abhängigkeiten und unterstützt alle gängigen Browser, einschließlich IE9 +.

Standardmäßig können Sie eine einfache Leiste verwenden, oder Sie können aus einigen wenigen Grundformen auswählen, z.

  • Einzelne Zeile
  • Halbkreis
  • Voller Kreis
  • Platz
  • Dreieck

Sie können auch Ihre eigenen benutzerdefinierten Formen wie ein Herz, eine Wolke oder sogar die Beschriftung des Logos Ihrer Website entwerfen. Zugegeben, das wird einige Anstrengungen erfordern, aber das Endergebnis kann unglaublich sein.

Die Bibliothek arbeitet mit SVG-Pfaden . Wenn Sie also eine umrissene Form mit SVG-Markup erstellen können , können Sie sie mit dieser Fortschrittsbalkenbibliothek animieren .

Animationen können auch Text enthalten oder benutzerdefinierte Start / Stopp-Muster haben . Die vollständige API enthält mehr Details mit Optionen / Rückrufen, die Sie in Ihrer Freizeit lesen können.

ProgressBar.js hat auch eine kleine Installationsanleitung, in der Sie das Skript mit Bower, npm oder der vereinfachten GitHub-Seite herunterladen und einrichten können .

Und wenn Sie etwas cooles bauen, können Sie Ihren Code in das GitHub Repo einreichen . Der Ersteller des Projekts, Kimmo Brunfeldt, hat ein offenes GitHub-Problem, bei dem Sie benutzerdefinierte Designs einreichen können , die in die Bibliothek aufgenommen werden sollen.

Sie können animierte Fortschrittsbalken zum Registrieren von Seiten, zum Hochladen von Feldern oder zu jeder Webseite als Preloader hinzufügen . Die Optionen sind nur begrenzt, wie detailliert Sie bereit sind.

Ich mag zum Beispiel die Demonstration des Passwortstärkemessgeräts, da sie einen echten Zweck erfüllt und der Benutzerfreundlichkeit zugute kommt . Dieses Beispiel ist im Lieferumfang des Plugins enthalten, sodass Sie es kopieren und nach Ihren Wünschen modifizieren können.

Um mehr Beispiele zu sehen, schau dir die ProgressBar.js Homepage an oder sieh dir diese Geige an, um die Herzanimation zu demonstrieren.

Der iStick: Der weltweit erste USB-Stick für iOS-Geräte

Der iStick: Der weltweit erste USB-Stick für iOS-Geräte

Apples iOS-Geräte sind großartig, aber alle haben das gleiche wichtige Problem: das Fehlen von USB-Unterstützung. Das Übertragen von Dateien von Ihrem iPhone oder iPad auf einen Computer funktioniert nur über das umständliche iTunes oder über eine Wi-Fi-Verbindung. Sie können natürlich auf Cloud-Speicher-Apps und -Dienste von Drittanbietern zurückgreifen, aber Sie haben möglicherweise Bedenken hinsichtlich Sicherheit und Datenschutz.Hier ist e

(Tech- und Design-Tipps)

Arbeitgeber: Zusammenarbeit zwischen Gen-X und Millennials

Arbeitgeber: Zusammenarbeit zwischen Gen-X und Millennials

In den heutigen Geschäftsorganisationen ist ein Chef wie ein Orchesterleiter. Ich habe mir diese Analogie geliehen, denn wie ein Dirigent, der das Tempo einstellt und die korrekten Eingaben jedes Musikers im Orchester sicherstellt, muss ein Chef wissen, wann und wie er die Talente und Fähigkeiten seiner Mitarbeiter im kollektiven Vorteil der Organisation einsetzen kann .D

(Tech- und Design-Tipps)