Kawałek Kodu

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

Przeczytałem i akceptuję regulamin, czyli dwuetapowy formularz z popup'em oparty o checkbox hack.

Prawie nikt nie czyta regulaminów, tych na stronach internetowych również, albo głównie na nich. Wynika to z faktu, że w momencie kiedy zachodzi potrzeba jego przeczytania jesteśmy w trakcie innych działań na tej stronie, albo z naszego lenistwa i niechęci. O ile na drugą kwestię nie mamy wpływu, to możemy delikatnie ułatwić dostęp do treści w trakcie np. rejestracji w sklepie internetowym.

Czytaj dalej

Element, którego byś nigdy nie ostylował, czyli wskaźnik przewinięcia strony inaczej.

Postępując z pierwszą zasadą tego bloga łączymy wynalazki z przeszłości z futurystycznymi nowinkami, aby móc się delektować efektem w teraźniejszości. Dziś, właśnie w tej chwili, połączymy znany pewnie niektórym z Was pasek postępu przewinięcia strony, z wykorzystaniem elementów HTML, których zazwyczaj nie wykorzystujesz.

Czytaj dalej

Perpetuum mobile, czyli animacja CSS odtwarzająca się po hover.

Dziś znów wracamy do tematu animacji CSS. Pomimo, że ostatnio robiliśmy baby steps, dziś będzie wielki krok w przód. Spróbujemy wystartować animację po najechaniu myszą na element, ale jednocześnie spowodować, aby odtwarzała się nadal po zjechaniu z niego. Bez JavaScript of course!

Czytaj dalej

Harmonijny Tag Można Lubić, czyli o tagach SUMMARY i DETAILS w HTML.

Choć boom na tzw. checkbox-hack chyba minął, nadal jest przydatny. Można rzec, że jego bohaterstwo spowszedniało. Jednym z jego wyczynów była współpraca przy efekcie akordeonu, czyli rozwijanych sekcji, tak aby pozbyć się konkurencji w postaci JavaScript. W dzisiejszym wpisie jeszcze bardziej go pogrążymy.

Czytaj dalej

Yeti - jedni widzieli, inni nie, czyli pseudoelement dla IMG

O ile pseudoelementy :before oraz :after odkryte kilka latu temu dziś już nikogo nie dziwią, tak niektóre ich odmiany nadal pozostają przedmiotem poszukiwań, jak Yeti dla kryptozoologi. Niektórym podobno udało się spotkać Yeti, niektórym podobno udało się dodać pseudoelement do elementu IMG. O ile w pierwszym przypadku nie mogę zaprzeczyć ani potwierdzić, to w drugim miałem tą miłą sposobność spotkać się z tym pseudoelementem w pobliżu IMG.

Czytaj dalej

Sińce zdobyte w narożniku, czyli o zaokrąglonych ramkach z gradientem.

Nie spoczywając na laurach zerkam też na konkurencyjne blogi, nawet żeby dostać sińca. Jednym z nich jest CSS-Tricks. I właśnie tam trafiłem ostatnio na wpis dotyczący ramek z gradientem dla elementów HTML. Ramki dodatkowo mają zaokrąglone narożniki, co wcale nie ułatwia zadania. Przedstawiono tam dwie metody, jedna stricte dotycząca ramek z nadanym border-radius. Druga opierała się o border-image, która to właściwość opiera się border-radius - jedna z drugą nie współgra.

Czytaj dalej