20 fantastycznych wtyczek typu jQuery
W ostatnich latach typografia sieci zmieniła się ze wstydu w dumę. Od CSS po JavaScript, niemal codziennie zdobywamy świetne narzędzia, które pomagają nam wdrażać niesamowite typy.
Dziś przyjrzymy się najlepszym dostępnym wtyczkom jQuery, które są specjalnie zbudowane, aby uczynić typ WWW bardziej niesamowitym. Pobierz kilka i weź swój typ dalej.
Przeglądaj zasoby projektowe
Manipulacja miarą typograficzną
FitText - Wtyczka do pompowania typu strony
FitText pozwala łatwo i automatycznie rozciągnąć kawałek tekstu do rozmiaru jego nadrzędnego kontenera.
HATCHSHOW: wtyczka jQuery do równoważenia środków
Hatchshow umożliwia tworzenie kolumn tekstu przy użyciu jednolitej miary, dzięki czemu uzyskuje się twardą krawędź i zmienny rozmiar tekstu (naprawdę popularny efekt).
slabText - wtyczka jQuery do tworzenia responsywnych nagłówków
Kolejna wtyczka, która wyrównuje miary dla twoich oddzielnych linii. Zaletą tego jest to, że linie zmieniają się naprawdę ładnie podczas zmiany rozmiaru rzutni.
Responsive-Measure
W tej wtyczce nie chodzi o tworzenie kreatywnych nagłówków, zamiast tego bierze się pod uwagę kilka zmiennych dotyczących twojego typu i generuje idealną i responsywną miarę akapitów. Jest to idealne rozwiązanie dla zachowania wysokiej czytelności tekstu w responsywnym projekcie.
BigText
BigText oblicza rozmiar czcionki i odstępy między wyrazami potrzebne do dopasowania wiersza tekstu do określonej szerokości. Tutaj jest fajny czarodziej.
Kerning
Kerning.js
Robi to dokładnie tak, jak to brzmi: pomaga kernować swój typ sieci. Projektanci stron internetowych zwykle omijają kerning, ponieważ jest tak skomplikowany i nieuporządkowany, że proces ten jest łatwy.
TypeButter: Optical Kerning FTW!
Zamiast ręcznie modyfikować kerning dla każdej litery, za pomocą TypeButter możesz skonfigurować kerning optyczny, który działa dla Ciebie. Możesz użyć jednej z dostarczonych konfiguracji czcionek lub rozwinąć własną.
jKerny.js, wtyczka jQuery ułatwiająca kerning
jKerny wprowadza nowe pseudo-selektory CSS do odstępów między literami, odstępów między słowami, pierwszej litery, ostatniej litery i innych.
Zawijanie
Boczek
Ekstremalne zawijanie tekstu. Boczek pozwala owijać tekst wokół krzywej Beziera lub linii. To naprawdę imponujące i może tworzyć naprawdę złożone zawijania.
jQSlickWrap - Zręczne zawijanie tekstu dla jQuery
JQSlickWrap pomaga owijać tekst wokół obrazu, bez względu na to, jak skomplikowany. Po prostu poprawisz kilka ustawień, a resztę załatwisz automatycznie.
Pionowe siatki rytmiczne i podstawowe
jMetronome: Korzystanie z jQuery w celu zachowania rytmu typograficznego
Ten skrypt pomaga zachować pionowy rytm typografii, dodając dopełnianie do różnych elementów nietekstowych, aby upewnić się, że jego całkowita wysokość jest wielokrotnością całkowitej wysokości linii dokumentu.
SimonFairbairn / Line-In-Typography
Ta wtyczka wyświetla wiersze na podstawie wysokości linii motywu, dzięki czemu można poprawnie ustawić pionowy rytm i wyrównać całą typografię do linii bazowej.
Automatyczna wysokość linii: wtyczka jQuery dla elastycznych układów
Automatyczna wysokość linii dostosowuje wysokość linii kontenera (np. Div) proporcjonalnie do jego szerokości w stosunku do rozmiaru czcionki. Kolejne świetne narzędzie pomagające w responsywnym typie.
Super praktyczny
Lettering.js - wtyczka jQuery do radykalnej typografii internetowej
Lettering.js daje Ci to, czego nie ma CSS: swobodę kierowania na każdą literę indywidualnie. Otwiera to wszystkie niesamowite możliwości kreatywnego stylizowania na podstawie litery.
KarlRoos / jQuery.responsiveText
Elastyczny tekst typu plug and play. Po prostu celuj w kontener lub całą stronę, a skrypt zajmie się resztą!
Fajne i szalone efekty
jqIsoText: jQuery Text Effect Plugin
Dziwaczna wtyczka tekstowa, która manipuluje wielkością pojedynczych liter, aby stworzyć niepowtarzalny efekt.
Arctext.js - Curving tekst przy pomocy CSS3 i jQuery
Tworzenie zakrzywionych linii tekstu jest dość trudne, gdy pracujesz z internetowym typem na żywo. Ta wtyczka sprawia, że jest to o wiele łatwiejsze, a nawet może pomóc w animowaniu zmiany.
Textualizer
Textualizer tworzy twórcze przejście z jednego akapitu do drugiego. Przejście jest rodzajem pomieszanego, pomieszanego efektu, który przyciąga twoją uwagę.
Shuffle Letters Effect: wtyczka jQuery
Ta wtyczka zapewnia animację, która cyklicznie przewija kilka losowych liter przed lądowaniem na wpisanym tekście. Miły i interesujący sposób na wprowadzenie nagłówka.
TextGrad
TextGrad tworzy gradient i rozciąga go wzdłuż linii tekstu. Prosty i skuteczny!
Co mnie ominęło?
Te dwadzieścia wtyczek jQuery reprezentuje najlepsze narzędzia typograficzne, jakie mogłem znaleźć. Jestem pewien, że jest o wiele więcej, więc zostaw mi komentarz poniżej i daj mi znać, co przegapiłem!