Kawałek Kodu

Co tu się odskryptala?! Czyli programistyczne porady na luzie

There's no place(holder) like SVG, czyli o lazy loading, ferajnie PICTURE+SOURCE+IMG i zaślepkach.

Czy substytut oryginału może dorównywać temu ostatniemu? Czy atrapa może być równie atrakcyjna? Czy niezamalowane kanwy obrazów mogą uratować właściciela galerii przed wpadką? O tym, no prawie o tym, w dzisiejszym wpisie.

Czytaj dalej

Włosek zakrętasek, czyli o stroke-dasharray, stroke-dashoffset, nietypowym preloaderze i... dziwnym wskaźniku przewinięcia strony.

Niezależnie od tego czy masz czuprynę jako Giorgio Tsoukalos czy też mógłbyś brać udział w Super Bowl, przepraszam Super Ball, włos z głosy Ci nie spadnie po przeczytaniu dzisiejszego odcinka. I nie tylko z głowy. Dziś o właściwościach związanych z SVG, może niekoniecznie jeżących włosy na głowie, ale równie ciekawych.

Czytaj dalej

Czym jest błąd matrixa, czyli o efekcie glitch w dwóch wariantach.

Pomysł na stworzenie efektu glitch chodził po mojej głowie od dawna. Co prawda za mgłą, ale chodził. Widziałem efekty na CSS-Tricks oraz na Tympanus, ale nie do końca mi odpowiadały. Zresztą opierają się o właściwość clip-path, która nie jest obsługiwana na Edge. Chciałem stworzyć coś...jakby to nazwać, mniej drętwego. Czy się udało, sam ocenisz. Tak więc dziś znów o filtrach w SVG. Wygląda na to, że wpadliśmy w pułapkę matrixa. Ale skoro już tu jesteśmy, to możemy bardziej obadać jego działanie. Przyjrzymy się pochodzeniu błędów matrixa. Będziemy Architektami! Albo raczej Psujami!

Czytaj dalej

Jak się wyszumieć, czyli o losowym tle w... SVG (spin-off).

Kto jeszcze nie zdążył się wyszumieć, będzie mieć szanse dziś. Co prawda jest niedziela, ale może to dobra okazja, w końcu dla większości dzień wolny, więc można go spożytkować w mniej praktyczny sposób. Będzie krótko i na temat, dosłownie.

Czytaj dalej

font-style: hollow, czyli jak stworzyć kolejny styl fontu w sekundę.

Pomimo, że multum serwisów udostępnia multum fontów do użycia na stronach internetowych, to czasem jednak brakuje nam odpowiedniego. Dziś o stylu na miarę plazmy, czyli czwartego stanu skupienia materii obok ciekłego, stałego i gazowego (regular, bold, italic). O stylu, który możemy zastosować do dowolnej czcionki, a szczególnie tych, które tego stylu standardowo... nie mają.

Czytaj dalej

Bądź jak Prometeusz, czyli o animowanym efekcie ognia w SVG.

Ten wpis porusza temat animacji w SVG i choć nie jest okraszony tytanicznym wysiłkiem, to jest iskierką nadziei na kontynuację tego tematu również w przyszłości. A póki co, bez bólu wątroby postaram się przemycić na Twój ekran odrobinę prawie prawdziwego ognia. Wiaderko wody nie będzie jednak potrzebne!

Czytaj dalej