10 gier, które poprawią Twoje umiejętności w zakresie CSSa oraz JavaScriptu

Kodowania możemy uczyć się na wiele różnych sposobów. Najpopularniejsze z nich to kursy, książki i przede wszystkim własne projekty, ale dziś chciałbym pomówić o czymś innym, czego można nie doceniać. Chodzi o gry, które możemy przechodzić za pomocą linii kodu wpisywanych z klawiatury i podczas tego uczyć się samego programowania! W tym artykule przedstawiam Ci 10…

Czytaj dalej

10 świetnych efektów użytych na zdjęciach

Współczesne wersje technologii webowych powalają nam na tworzenie bardzo ciekawych efektów, które sprawiają, że nasze witryny stają się znacznie bardziej interaktywne oraz przyjemniejsze w odbiorze. Dlatego w tym artykule pokażę Ci przykłady tego, w jaki sposób przy pomocy CSSa oraz JavaScriptu możemy stworzyć świetne efekty gotowe do użycia na wszelkich grafikach dodanych do stron internetowych….

Czytaj dalej

Prosta i lekka biblioteka, która pozwoli Ci dodać karuzelę do swojej strony WWW

Bardzo popularnym elementem dzisiejszych stron internetowych są tak zwane karuzele, czyli elementy, których zawartość możemy zmieniać przez pociągnięcie za slajd lub za pomocą guzików widocznych w przeglądanym serwisie. Szczególnie ciekawy jest ten pierwszy sposób, bo jeśli obsługa naszej karuzeli będzie możliwa z poziomu myszki (lub palca w przypadku urządzeń mobilnych), to cała witryna stanie się…

Czytaj dalej

Pasek postępu, który rozszerza się podczas przewijania strony internetowej

Skoro przeglądasz tego bloga, to jest spore prawdopodobieństwo, że śledzisz również inne, na których można spotkać się z dość ciekawym efektem. Chodzi o pasek postępu, zapełniający się wraz z przewijaniem konkretnej witryny. Właśnie w tym wpisie chciałbym pokazać Ci jak w nieskomplikowany sposób można stworzyć coś podobnego. Wszystko wykonamy w czystym JavaScript’cie, bo wg mnie…

Czytaj dalej

Jak wykonać preloader w czystym JavaScript’cie?

Zapewne każdy z nas spotkał tzw. preloader, czyli element zasłaniający witrynę, dopóki ta nie zostanie w pełni załadowana. Jak stworzyć coś takiego? Tego dowiemy się w dzisiejszym artykule! 🙂 Efekt końcowy. Zacznijmy od konkretów, bo nie chciałbym marnować Waszego czasu. Demo można znaleźć po tym oto adresem. Chciałbym abyśmy skupili się na mechanice, która powoduje, że…

Czytaj dalej

10 świetnych bibliotek z animacjami, które ożywią Twoje strony internetowe

Nie da się ukryć, że jeśli nie przesadzimy z animacjami, to okazują się bardzo ciekawym elementem, który sprawia, że nasze witryny nabierają życia i stają się znacznie bardziej interaktywne. Tylko, że nieraz stworzenie ciekawej animacji może wymagać sporej ilości pracy w stosunku do otrzymanego rezultatu i właśnie w tym przypadku z pomocą przychodzą nam biblioteki,…

Czytaj dalej

Efekt maszyny do pisania wykonany w JavaScript za pomocą biblioteki Typed.js

Czy kiedykolwiek spotkałeś efekt, w którym tekst samoistnie się pojawia, sprawiając wrażenie pisanego automatycznie? A jeśli tak, to czy myślałeś może jak zrobić coś takiego? W tym wpisie chciałbym pokazać jeden ze sposobów, jakim jest dość popularna biblioteka, o nazwie Typed.js. Zapraszam do lektury! 🙂 Czym jest biblioteka Typed.js? Nazwa ta określa chyba najbardziej rozbudowany…

Czytaj dalej

Wycinanie elementów w CSS dzięki właściwości clip-path

CSS jest rozwijany z każdym dniem, otrzymując coraz to nowe funkcjonalności, które ułatwiają nam tworzenie stron internetowych. Właśnie o jednej z nich chciałbym pomówić w tym artykule, a dokładnie o właściwości clip-path, która to pozwala nam na wycinanie elementów, a tym samym tworzenie mniej prostokątnych stron internetowych. 🙂 Trochę ogólnych informacji. Eksperymentalna właściwość clip-path, pozwala na…

Czytaj dalej

Jak dodać efekt pojawiania się elementów podczas przewijania strony internetowej?

Każda osoba, która przegląda Internet musiała spotkać się z efektem tzw. pojawiającej się treści. Niektórzy z nas mogli wtedy pomyśleć: Jak stworzyć coś takiego? 🙂 Otóż sposobów jest wiele. Ja przez długi czas korzystałem z połączenia Animate.css oraz Viewport Checker, biblioteki opierającej się na jQuery. Niektórzy zamiast tego drugiego używają tzw. Waypoints, z kolei jeszcze…

Czytaj dalej