Kody, triki, sztuczki
Mamy div który ma wysokość ustawioną na height: 0;. Po kliknięciu chcemy aby była "gładka" animacja pojawiąjącego się tekstu. Jest jeden problem, po toggle wysokość jest ustawiana na auto i zamiast "gładkiego" przejścia z wysokości 0 do auto, div po prostu się pojawia zamiast zwiększyć wysokość dynamicznie. Powiesz, a czemu
Czasami się zdarza, że musimy użyć "resize" 😉 Nie będę się rozpisywał co to jest wystarczy zerknąć tutaj - resize Poniżej przykład użycia, a także wywołania jakiejś randomowej funkcji. // nasz funkcja function jakasFunkcja() { if (window.innerWidth < 600) { // tutaj coś robimy } else { // tutaj coś
Oj dawno mnie tutaj nie było 😉 Dzisiaj coś co ostatnio mi się bardzo przydało, a mianowicie dodanie data attribute do markera. Potrzebowałem kilka takich elementów. A więc zacząłem od rozszerzenia funkcji divIcon. Poniżej funkcja, która jest dość prosta. Używamy metody createIcon const DataMarkers = L.DivIcon.extend({ createIcon: function (oldIcon)
Dość często potrzebujemy aby style były widoczne lub inaczej się zachowaywały/wyglądały gdy użytkownik używa strony na desktopie a inaczej na urządzeniu mobilnym "dotykowym" bez urządzenia sterującego np. myszy. Do detekcji typu urządzenia możemy użyć "media queries". Najpierw przyglądnijmy się @media (hover: hover) W poniższym przykładzie jedynie urządzenia które mają możliwość
W leaflet domyślnie mamy dostępne cztery miejsca (cztery rogi mapy) w które możemy wstawić własne elementy lub zmienić pozycję już istniejących elementów np. zoom in/out. Te miejsca to oczywiście [topleft, topright, bottomleft, bottomright], a co jeżeli chcemy stawić dodatkowy element ale na górze strony i na środku. Oczywiście możemy
Spis treści CSS Custom Highlight API Czy pamiętasz te frustrujące chwile gdy aby podświetlić tekst na stronie musiałeś dodawać tagi takie jak mark i dodawać do nich style CSS? Było to uciążliwe ponieważ wymuszało na Tobie cięcie tekstu i zmiany w treści. A może miałeś problemy jako użytkownik jakiejś aplikacji?
Świeżo obejrzałem demo kursu AIDevs: I chciałbym podzielić się w Wami obserwacjami jakie miałem. Wg mnie kurs będzie szalenie ciekawy 🙂 Dlaczego? Oto dwa powody dlaczego zainteresować się kursem po obejrzeniu Demo, podczas którego Adam Gospodarczyk z Overment pokazał jak wykorzystuje technologie AI na co dzień. Jest się czym inspirować
Czy zastanawiało Cię, jak poprawić czytelność swojego kodu i uczynić go prostszym? Właśnie znalazłeś się w odpowiednim miejscu! W dzisiejszym artykule zobaczysz technikę zwaną “early return” i dowiesz się jak może ona sprawić, że kod będzie wyglądał i działał lepiej. Dlaczego więc warto używać early return? Kod jest wyraźniejszy Spójrz
Branża frontendowa jest bardzo wymagająca, a obranie dobrej ścieżki może być trudne dla początkujących programistów. Dlatego zapytałem 8 doświadczonych ekspertów: “Jakiej rady udzieliłbyś samemu sobie z przeszłości, by szybciej wejść na poziom eksperta na froncie?”. W tym artykule znajdziesz cenne wskazówki i porady od ludzi, którzy przeszli przez proces nauki
Co zrobić ze sobą, gdy osiągniemy już pewien poziom doświadczenia w programowaniu? O tym co dalej porozmawiam dziś z twórcą Type of Web, autorem książki „Typescript na poważnie” i autorem kursów programistycznych – Michał Miszczyszynem. Przeczytaj wywiad a na końcu znajdziesz 10% rabatu na trzecią edycję Praktyczny kurs: Nowoczesny Frontend
JS Dżem YouTubeJS Dżem YouTube
JS Dżem YouTube
Link do wydarzenia: https://www.meetup.com/meet-js-pozna%C5%84/events/292846198 Tak naprawdę to wystarczy po prostu przyjść, nie trzeba się zapisywać 😉 Nie wahaj się, zabierz ze sobą ziomka, luźna atmosfera
JS Dżem YouTube
🚀 Newsletter: https://www.subscribepage.com/web3mailing ➡️ Zapytaj na Discordzie: https://discord.gg/TepkFyV7 ➡️ Twitter: https://twitter.com/le_brande ➡️ Instagram: https://www.instagram.com/lebrande 🔴 Jeśli chcesz zrobić efekt 3d na twojej stronie, to wcale nie musisz myśleć o trzech wymiarach. Możesz wszystko osadzić w pozornej siatce izometrycznej a następnie dokonać kilku transformacji. Kod na Githubie: https://github.com/lebrande/animated-column-chart Gotowy projekt: https://animated-column-chart.netlify.app/
JS Dżem YouTube
🚀 web3 Dev Newsletter: https://www.subscribepage.com/web3mailing ➡️ Zapytaj na Discordzie: https://discord.gg/TepkFyV7 ➡️ Twitterze: https://twitter.com/le_brande ➡️ Instagram: https://www.instagram.com/lebrande 🔴 Czy biblioteka viem zastąpi ethers.js i web3.js? W tym odcinku przegląd tego, co obiecuje viem. https://viem.sh/ https://wagmi.sh/ 0:00 - Co to jest viem? 2:02 - Dlaczego viem? 6:09 - Przegląd dokumentacji 8:40
JS Dżem YouTube
🚀 Zapisz się na newsletter: https://jsdzem.pl/newsletter ➡️ Discord: https://discord.gg/KhVAXsn3 ➡️ Twitter: https://twitter.com/le_brande ➡️ Instagram: https://www.instagram.com/lebrande ➡️ Grupa na fejsie: https://www.facebook.com/groups/jsdzem 👨🏫 To jest kanał JS Dżem i mówię tu o programowaniu i web3 🔴 W tym odcinku zestawiam ze sobą dwie najpopularniejsze biblioteki do projektów związanych z web3 i blockchain.
Frontlive.pl by Olaf SulichFrontlive.pl by Olaf Sulich
Tokeny są podstawowym budulcem każdego szanującego się Design Systemu. Przyspieszają pracę i pozwalają projektantom budować spójne i skalowane projekty. A co ma do tego Frontend?
Frontlive.pl by Olaf Sulich
Frontend to nie programowanie, tylko centrowanie głupich divów! Ile razy usłyszałeś coś podobnego? Czy Frontend to faktycznie dziedzina dla półgłówków? Prawda jest zupełnie inna i nie daj sobie wmówić, że jest inaczej.
Frontlive.pl by Olaf Sulich
Zapewnij jeszcze większe bezpieczeństwo aplikacji w TypeScript! Sprawdź jak możesz wykorzystać walidację do zbadania poprawności danych w czasie działania programu.
Frontlive.pl by Olaf Sulich
Niech pierwszy rzuci kamieniem ten, który nigdy nie miał problemów z z-index w CSS. Poprawne ułożenie elementów nie raz przyprawiło mnie o ból głowy. Masakra. Jak sobie z tym radzić?
Frontlive.pl by Olaf Sulich
Kodowanie nie idzie? Nie widzisz postępów? Zobacz jak z głową rozpalnować swoją naukę i jakich błędów unikać podczas nauki programowania.