Wpis z mikrobloga

#webdev #html #css #gif #js #cssdemo
Bardzo prosty przycisk bez użycia JS i pochodnych bibliotek.

Jeden przycisk z użyciem zaledwie jednego , a trwałe przyciśnięcie przy pomocy ukrytego "checkbox" albo "radio" (inaczej musiałbym JS użyć).
Główny prostokąt to ten ciemniejszy czerwony z ustawionym cieniem wokół. A jasnoczerwony to pseudoelement ":before", czyli element zduplikowany bez utworzenia kolejnego elementu w HTML.

rukh - #webdev #html #css #gif #js #cssdemo
Bardzo prosty przycisk bez użycia JS i p...

źródło: comment_wkr3lEg6Ofwl3xRAooagr6aKwlM7fI3Z.gif

Pobierz
  • 9
  • Odpowiedz
  • Otrzymuj powiadomienia
    o nowych komentarzach

@MegaZU0: hmm, nie jest to "input type=text". Spróbowałem. Trwałe przyciśnięcie da się uzyskać za pomocą ":target", ale wtedy się adres na pasku zmienia.
@MKu8ar: jak to nie? Przecież :focus działa wtedy, gdy coś jest "namierzone"
  • Odpowiedz
@addr: przełączanie w CSS bądź w JS to nie robi różnicy chyba że ktoś wpadnie na pomysł wyłączenia JS na stronie. Jednak animowanie w CSS jest wydajniejsze.
@MegaZU0: im wyższa rozdzielczość, czyli większy element, tym niestety mniej wydajne. Już byłoby lepiej w Canvas zrobić, bo on renderuje wyświetlaną grafikę do rastrowej (powiększysz stronę i już widzisz schodkowanie krawędzi).
Dobrze widać to po aplikacjach na smartfony - samo rysujące
  • Odpowiedz