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


Dynamisch abgeschnittener Text mit Shave.js Plugin

Die meisten WordPress-Blogs verwenden die Funktion "Mehr lesen", um Vorschautext aus einem Beitrag anzuzeigen. Dieser Text wird abgeschnitten und an einer bestimmten Stelle abgeschnitten, um Platz zu sparen und Leser dazu zu ermutigen, weiter zu klicken, um weiter zu lesen .

Aber manchmal möchten Sie diese Funktion auf einer einzigen Seite hinzufügen. Geben Sie Shave.js ein, das JavaScript-Plugin zum dynamischen Abschneiden von Inhalten .

Eine coole Tatsache über dieses Plugin ist, dass es von Dollar Shave Club erstellt wurde, dem Team, das eine der lustigsten Anzeigen gemacht hat, die ich je gesehen habe. Ich war mir nicht bewusst, dass ihr Team sogar eine GitHub-Seite hatte, aber es ist voller Repos, sowohl originell als auch gegabelt.

Dieses spezielle Plugin ist ziemlich neu und hat bereits 800+ Sterne. Es ist unabhängig von Abhängigkeiten, sodass es unabhängig vom Browser oder anderen enthaltenen Bibliotheken auf normalem JavaScript ausgeführt werden kann .

Code-Setup ist auch ziemlich einfach mit der Shave () -Funktion nur zwei Parameter: eine Elementauswahl und eine maximale Höhe für dieses Element. Hier ist ein sehr einfaches Beispiel:

 maxheight = 320; rasieren ('. elemclass', maxheight); 

Natürlich gibt es zusätzliche Parameter, die Sie nach dem abgeschnittenen Text für benutzerdefinierte Zeichen übergeben können, oder mehrere Selektoren, auf die Sie den Rasureffekt anwenden möchten .

Sie können tatsächlich eine Live-Demo auf der Shave-Plugin-Seite sehen und sie haben auch eine schöne CodePen-Demo.

Shave wurde für die Arbeit mit jQuery oder Zepto entwickelt, wenn Sie eine dieser Bibliotheken bevorzugen. Aber da es auch auf Vanilla JS läuft, ist es eines der einfachsten Plugins, die Sie auf Ihrer Seite finden und benutzen können.

Es gibt nicht zu viele Szenarien, in denen Sie Text abschneiden möchten, aber wenn Sie es tun, ist es viel einfacher, ein Plugin wie Shave zu verwenden, als den gesamten Code selbst zu schreiben.

Laden Sie eine Kopie aus dem GitHub Repo herunter oder ziehen Sie sie aus einem Repo wie npm. Sie finden auch Richtlinien und Dokumentation zum GitHub Repo, so dass Sie buchstäblich nur kopieren, einfügen und rasieren können!

30 Double-Spread-Magazin-Anzeigen, mit denen Sie die Seiten drehen können

30 Double-Spread-Magazin-Anzeigen, mit denen Sie die Seiten drehen können

Zeitschriftenwerbung gilt als eine traditionellere Form der Werbung und belegt mehr als 30% des herkömmlichen Zeitschriftenplatzes. Wenn dies jedoch richtig gemacht wird, können Vermarkter ihre Anzeigen nutzen, um sich auf ein bestimmtes Zielpublikum zu konzentrieren, indem sie das richtige Magazin auswählen, um es einzubinden. D

(Tech- und Design-Tipps)

Teilen Sie große Dateien und Projekte mit Pibox Messaging App

Teilen Sie große Dateien und Projekte mit Pibox Messaging App

Wir wählen unsere beliebtesten Messaging-Apps aus einer Vielzahl von Gründen, Vorlieben und Bedürfnissen . Aber unter allen verfügbaren Messaging-App-Optionen, die es gibt, wenn es darum geht, große Dateien zu teilen, können nicht alle liefern.Normalerweise begrenzen Messaging-Apps die Größe des Bildes. Das be

(Tech- und Design-Tipps)