Elementy interfejsu
Menu, przyciski, zakładki, karty i formularze. Gotowe struktury HTML z CSS i zachowaniem JavaScript.
Otwórz konfiguratory ↗426 przykładów
Ścieżka nawigacji z wyborem projektu
Rozwijana lista skraca przejście do sąsiedniego elementu.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABPanel skrótów klawiaturowych
Pomoc pokazuje dostępne akcje i reaguje na wybrane skróty.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABWłasne menu kontekstowe
Menu pojawia się po prawym kliknięciu albo z przycisku.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABFormularz wieloetapowy
Kolejne kroki, prosta walidacja i podsumowanie lokalne.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABWprowadzanie kodu jednorazowego
Sześć pól z przechodzeniem i wklejaniem całego kodu.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABPole dodawania tagów
Enter dodaje etykietę, a przycisk pozwala ją usunąć.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABTextarea dopasowana do treści
Pole rośnie podczas wpisywania i pokazuje liczbę wierszy.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABWybór wielu opcji z podsumowaniem
Checkboxy zamieniają się w czytelny zestaw wybranych opcji.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABWyszukiwany wybór technologii
Wpisywanie zawęża listę dostępnych opcji.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABPrzeciąganie zdjęcia z podglądem
Lokalny podgląd pliku wybranego lub przeciągniętego do pola.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABFormularz z lokalnym szkicem
Treść jest zachowywana w tej przeglądarce po wpisaniu.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABLimit tekstu z paskiem wykorzystania
Licznik i pasek pokazują pozostałe znaki bez zgadywania.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABTabela z sortowaniem kolumn
Kliknięcie nagłówka sortuje tekst lub wartości liczbowe.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABLista z filtrem i stronicowaniem
Wyszukiwanie i paginacja współpracują na lokalnym zestawie danych.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABTablica zadań z przenoszeniem kart
Przeciąganie i przyciski przenoszą zadania między kolumnami.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABPrzeszukiwane drzewko plików
Rozwijane foldery oraz wyszukiwanie nazw w strukturze.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABTabela edytowana bezpośrednio w komórkach
Zmiana ilości i ceny od razu aktualizuje podsumowanie.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABCennik miesięczny i roczny
Przełącznik pokazuje cenę miesięczną i rzeczywistą sumę roczną.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABRozwijanie długiej treści
Przycisk rozwija tekst i aktualizuje aria-expanded.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABRozsuwane karty tematyczne
Wybór karty odsłania opis i powiększa jej obszar.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABZakładki kodu z kopiowaniem
Przełączanie HTML, CSS i JavaScript oraz kopiowanie.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABPoradnik z nawigacją po krokach
Poprzedni i następny krok z oznaczeniem postępu.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABWyszukiwanie frazy w tekście
Bezpieczne podświetlanie wszystkich trafień bez innerHTML.
Zobacz kod i podgląd ↗HTML / CSS / JS / LABLista kontrolna wdrożenia
Zaznaczanie zadań przelicza postęp i pokazuje zakończenie.
Zobacz kod i podgląd ↗