Kawałek Kodu

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

Follow the white mouse, czyli o poruszaniu obiektu za myszą w CSS

Kiedy Trinity wypowiadała słowa o białym króliku, nie miała chyba świadomości, że jest możliwe śledzenie kursora myszy w czystym CSS. No cóż, film nie jest nowy i bracia, a raczej siostry Wachowskie nie przewidywały scenariusza, w którym wyjście z Matrixa będzie możliwe bez użycia JavaScript. Gdyby wiedziały o czym będzie dzisiejszy wpis, kolejna część nazywała by się pewnie "Matrix - Revelations".

Czytaj dalej

Zoom na lupę, czyli prosty (nie)plugin do powiększania obrazków.

Będąc dzieckiem posiadałem plastikowy mikroskop produkcji СССР. To, że był takiej produkcji i z takiego materiału, nie przeszkadzało, aby dostarczał ogromną frajdę. Oczywiście trzeba było podejrzeć włos, powiększenie kartki pomazanej długopisem czy też źdźbło trawy. Kawałek plastiku i szkiełka pozwalał w jednej chwili przenieść się do fascynującego mikroświata. Dziś też przeniesiemy się na chwilę w taki świat.

Czytaj dalej

"The Bold and The Peaceful", czyli co zrobić aby bold się nie rozpychał

Kiedy zasiadasz przy świątecznym stole robisz to jak zręczny akrobata. Gorzej jest kiedy chcesz się z niego wydostać po skromnych dwunastu posiłkach. Wszyscy obok zaczynają się krzywić, bo muszą się przesuwać na boki wraz z krzesłami. Efekt ten można zaobserwować również na co dzień, kiedy na swojej stronie testujesz menu nawigacyjne z piękną czcionką. I wszystko jest dobrze, dopóki mysz nie będzie najeżdżać na wybrane opcje, które pogrubiają się. Wszystkie opcje na prawo od wybranej przesuwają się w prawo jak niezadowoleni członkowie Twojej rodziny.

Czytaj dalej

Tylko się spóźnij! Czyli o nietypowym użyciu transition-delay.

Dzisiejszy wpis jest nie tylko dla tych, którzy spóźnili się na własny ślub czy na obiad z teściami. Jest dla wszystkich, a dla tych pierwszych może być swoistym katharsis. A dlaczego? Bo dziś będziemy chwalić spóźnienia. Ba! Nie tylko chwalić, ale nawet z premedytacją używać.

Czytaj dalej

Upychanie walizki, czyli o właściwości object-fit i object-position

Każdy lubi wyjazdy, ale chyba mało kto lubi się pakować. Szczególnie kiedy do dyspozycji mamy jedną walizkę, albo jedną reklamówkę... a multum rzeczy do zabrania ze sobą, oczywiście potrzebnych. Dziś też będziemy upychać, ale w jedną rzecz i w bardziej przyjemny sposób. (Nie, nie, nie! Mam na myśli CSS!).

Szeroki, wąski, niski, wysoki, każdy upchnąć się może.

Czytaj dalej

Baby steps, czyli kroki w animacji CSS

Czy ucząc się do matury stosowałeś technikę interwałów? Czyli trochę się pouczę, trochę pogram na komputerze, powtórzę twierdzenia i zobaczę co w telewizji, przypomnę sobie lektury i wyskoczę do kolegi? Jeśli tak, to dziś przypomnimy sobie ją w kontekście animacji CSS - będzie ona działać równie leniwie jak my przed maturą.

Czytaj dalej