Dinamikus csonkolt szöveg a Shave.js bővítővel

A legtöbb WordPress blog a "read more" funkciót használja az előnézeti szöveg megjelenítéséhez. Ez a szöveg csonkítva van, és egy bizonyos ponton levágja a helyet és a helyet ösztönözze az olvasókat arra, hogy további olvasásra várjanak.

De néha ezt a funkciót egyetlen oldalra szeretné hozzáadni. Írja be a Shave.js nevű JavaScript plugint dinamikusan csonkító tartalom.

Hűvös tény, hogy ez a bővítmény a Dollar Shave Club, a csapat, aki az egyik legcsodálatosabb hirdetést készítettem, amit valaha láttam. Nem voltam tisztában azzal, hogy a csapatuknak is volt GitHub oldala, de tele van repókkal mind az eredeti, mind a villás.

Ez az adott plugin meglehetősen új, és már 800+ csillaggal rendelkezik. Ez függőségmentes, így a böngészőtől vagy más mellékelt könyvtáraktól függetlenül sima JavaScripten futtatható.

A Kód beállítása is nagyon egyszerű a borotválkozás() csak két paramétert használva: a elemválasztó és a maximum magasság ehhez az elemhez. Íme egy nagyon alapvető példa:

 maxheight = 320; borotválkozás ('. elemclass', maxheight); 

Természetesen vannak további paraméterek, amelyeket az egyéni karakterekhez továbbíthat a csonkolt szöveg után, vagy több szelektor, ahol a borotválkozási hatást alkalmazni kívánja.

Valójában egy élő demót láthat a Shave plugin oldalon, és van egy szép CodePen demója is.

A borotvát építették dolgozzon a jQuery-n vagy a Zepto-n ha tetszik az egyik ilyen könyvtár. De mivel is vanília JS-en fut ez az egyik legegyszerűbb plugin a webhelyére való belépéshez és a használat elkezdéséhez.

Nincs túl sok forgatókönyv, ahol a szöveget le szeretné csonkítani, de ha sokkal könnyebb, hogy olyan plugint használjon, mint a Shave, mint az összes kód írása..

Az induláshoz töltsön le egy példányt a GitHub repóból, vagy húzza vissza a repót, mint az npm. Meg fogja találni a GitHub repo útmutatóját és dokumentációját is, így szó szerint csak másolhat, beilleszthet és borotválhat!