• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

onclick w css

VPS Starter Arubacloud
0 głosów
2,624 wizyt
pytanie zadane 8 maja 2018 w HTML i CSS przez matizuu Obywatel (1,100 p.)
#btnLeft:hover {
    	width:70px;
    	height:74px;
    }

    #btnLeft:onclick {
    	width:70px;
    	height:74px;
    }

Znalazłem fajne przedstawienie tego co chcę uzyskać (widoczny powyżej), ale nie odszukałem rozwiązania.

Mam ukryty element, i chcę go wyświetlić po kliknięciu w inny element, ale chciałbym to zrobić samym html i css, a więc jak?

2
komentarz 8 maja 2018 przez RafalS VIP (122,820 p.)
Specjalista nie jestem, wiec poczekam az ktos innys sie wypowie, ale obstawiam, ze bez js sie nie da.
komentarz 8 maja 2018 przez matizuu Obywatel (1,100 p.)
Ogólnie mam małe rozwiązanie z checkboxem, ale nie o to chodzi, zapomniałem dodać w poście, że checkbox odpada.
komentarz 8 maja 2018 przez Apiczkens Początkujący (390 p.)
Bez zdarzenia w js nie da się tego zrobić niestety.
komentarz 8 maja 2018 przez jpacanowski VIP (101,940 p.)

@matizuu, Widać, że kod skopiowałeś stąd
https://stackoverflow.com/questions/13630229/can-i-have-an-onclick-effect-in-css

A więc, masz tam odpowiedzi pod pytaniem.

3 odpowiedzi

+1 głos
odpowiedź 8 maja 2018 przez Comandeer Guru (599,730 p.)

Tam, gdzie znalazłeś to przedstawienie, jest też sensowna odpowiedź.

Niemniej tego typu zachowanie powinno się implementować w JS.

0 głosów
odpowiedź 8 maja 2018 przez Sejdi Początkujący (460 p.)

Mógłbyś zrobić coś takiego:

<button class="btn">Click on me</button>
<div id="to-hidden">Lorem ipsum ...</div>
#to-hidden
{
  display: none;
}

.btn:focus + #to-hidden
{
  display: block;
}

jednak takie rozwiązanie ma wiele wad m.in element #to-hidden musi być bezpośrednio pod elementem który go aktywuje. Osobiście uważam więc że użycie js było by po prostu lepsze.

Rozwiązanie na codepen

0 głosów
odpowiedź 8 maja 2018 przez pablop76 VIP (123,060 p.)

:target jest chyba dobrym rozwiązaniem.

 

komentarz 8 maja 2018 przez Tomek Sochacki Ekspert (227,510 p.)
pomijając różne rozwiązania omijające JS warto jednak zastanowić się, czy czasami w apce gdzieś jeszcze nie używamy JS bo wtedy takie usilne omijanie tego w CSS jest trochę wg mnie bez sensu...

Podobne pytania

0 głosów
1 odpowiedź 1,621 wizyt
pytanie zadane 14 maja 2018 w JavaScript przez anna135B Początkujący (270 p.)
0 głosów
2 odpowiedzi 832 wizyt
pytanie zadane 6 czerwca 2015 w HTML i CSS przez Pan Kulomb Pasjonat (18,630 p.)
0 głosów
1 odpowiedź 218 wizyt
pytanie zadane 5 czerwca 2020 w JavaScript przez Marak123 Stary wyjadacz (11,190 p.)

92,454 zapytań

141,262 odpowiedzi

319,089 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...