Wszystkie posty z kategori "CSS"

Transition CSS3 i slider

Bardzo często proste sztuczki mogą nam mocno poprawić komfort pracy. Dzisiaj przyjrzymy się jednej z takich prostych, aczkolwiek magicznych rzeczy. Mowa o CSS3 transition, dzięki której jesteśmy w stanie animować nie tylko proste przejścia linków, ale także i całe skomplikowane layouty.

Stylowanie formularzy

Gdyby zapytać wielu webmasterów co sądzą na temat stylowania elementów formularzy, rzucili by się zapewne na nas z łapskami :) Jest to strasznie nielubiana i ogólnie nie zalecana rzecz – szczególnie, że formularze są bardzo oporne na zmianę wyglądu.

Jednak poza minusami, zmiana wyglądu niesie z sobą także plusy. Nie tylko wizualne, ale także i użyteczne. Kto np. próbował używać chekboxów na telefonach (np na przeglądarce Dolphin), ten pewnie wie jak nieintuicyjne i malutkie są te elementy. Zamiast bez problemu kliknąć w duży (może na całą szerokość?) element, musimy celować paluchem w mikro inputy. Masakra na całego.

Tutaj właśnie do akcji wkracza zmiana wyglądu tych elementów, za pomocą której możemy rzeczy kiepskie zmienić w o wiele lepsze.

Zasady pomniejsze

Jeszcze wczoraj dostałem do pocięcia pewien layout. Prosta stronka, żadne wyzwanie, a przy okazji wyraźnie pokazująca, czego nie powinniśmy robić projektując strony.

Niestety samego layoutu pokazać wam nie pokażę, bo nie za bardzo mogę :) Pisać na szczęście nikt nie może mi zabronić, więc zapraszam do dalszej lektury, w której opiszę kilka punktów, które często spotykam podczas cięcia layoutów, które dostaję od różnych grafików.

Responsive menu

W dzisiejszych czasach, gdy internet przeglądany jest na różnorakich urządzeniach tworzenie sztywnych nawigacji jest błędem. Jak wiemy, dobra nawigacja po naszej stronie to klucz do jej sukcesu, a przynajmniej jeden z głównych elementów wpływających na niego.

Stworzenie płynnego, dopasowującego się do wielkości ekranu menu wcale trudnym zadaniem nie jest, o czym przekonacie się już za chwilę.

Przerabianie Datepickera

Bardzo często podczas tworzenia formularzy spotykamy się z koniecznością dołączenia pól do wyboru daty. Jest sporo pluginów do wyświetlania kalendarzy, ale większość z nich jest ciężka w użyciu.

Te związane z jQuery UI wymagają użycia tej biblioteki, co często prowadzi do tego, że wykorzystujemy ją tylko do wyświetlenia kalendarzyka (czyli taki ala przerost formy nad treścią). Dodatkowo zmiana wyglądu takich kalendarzy nie należy do najprzyjemniejszych rzeczy. Właściwie jest niepokojąco ciężka :)

Jakiś czas temu znalazłem plugin zwący się simple jQuery date-picker plugin. W chwili pisania tego tekstu strona tego pluginu jest nieaktywna, ale to nic nie szkodzi.

Plugin ten w odróżnieniu od innych działa na każdej przeglądarce i jest maksymalnie prosty. Odpalenie jego to tylko jedna linijka kodu, a podstawowe stylowanie to raptem kilkanaście linijek kodu (ostylowanie prostej tabeli).