 [CSS][HTML]blokowanie wybranego obszaru <a> |
  |
| [CSS][HTML]blokowanie wybranego obszaru <a> |
  23.04.2020, 11:48:15
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 196 Pomógł: 0 Dołączył: 9.03.2017 Ostrzeżenie: (0%) 
 |
https://codepen.io/reti/pen/ExVZQKO
Kod <div class="div1"> <a href="https://www.flaticon.com"> <div class="div2"> <div class="div3"> </div> </div> </a> </div> Kod .div1 { background-color: green; width: 300px; height: 300px; display: flex; align-items: center; justify-content: center; } .div2 { display: flex; justify-content: center; align-items: center; background-color: red; width: 200px; height: 200px; } .div3 { display: flex; justify-content: center; align-items: center; background: url("https://www.freuciv.com/wp-content/uploads/2020/04/cinema.png") 0 0 no-repeat; background-size: auto; width: 50px; height: 50px; } Jak najprościej wyłączyć .div3 spoza zasięgu <a>? Innymi słowy: jak to zrobić, żeby nie można było z .div3 otworzyć hiperłącza? Ten post edytował stellatus 23.04.2020, 11:50:28 |
 |
 
|
|
23.04.2020, 11:53:37
Post
#2
|
|
|
Grupa: Zarejestrowani Postów: 6 761 Pomógł: 1822 Dołączył: 11.03.2014 Ostrzeżenie: (0%)
|
https://developer.mozilla.org/en-US/docs/We.../pointer-events
A dlaczego element w środku nie będzie aktywny? -------------------- |
|
|
|
|
23.04.2020, 12:25:37
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 196 Pomógł: 0 Dołączył: 9.03.2017 Ostrzeżenie: (0%)
|
Wpisanie pointer-events: none w .div3 nie działa.
Spójrz proszę tutaj: https://www.freuciv.com/ Każda miniatura ma ikonę w prawym górnym rogu. Ikony te informują o typie odnośnika. Naciskanie na nie nie powinno powodować otwierania hiperłączy postów. Jedynie najchechanie myszką powinno powodować wyświetlenie się informacji tekstowej dotyczącej znaczenia ikony ("play" - film; "klawiatura" - software, itd.). Na ekranach dotykowych, po kliknięciu powinna też się wyświetlać ta informacja, więc właściwie to nie wiem jak to rozwiązać. Wygląda na to, że chyba najlepiej zrobić to tak jak w ikonach w lewych górnych rogach miniatur. Czy się mylę? Ten post edytował stellatus 23.04.2020, 12:27:36 |
|
|
|
|
23.04.2020, 12:40:46
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 6 761 Pomógł: 1822 Dołączył: 11.03.2014 Ostrzeżenie: (0%)
|
Jeśli tak, to lepiej stwórz nadrzędny kontener, w którym element <a> oraz ta ikona będą sąsiadami (na tym samym poziomie).
-------------------- |
|
|
|
|
24.04.2020, 09:44:56
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 196 Pomógł: 0 Dołączył: 9.03.2017 Ostrzeżenie: (0%)
|
Tak spróbuję. Dzięki!
Dzięki, bardzo mi pomogłeś. |
|
|
|
|
|
Wersja Lo-Fi | Aktualny czas: 25.04.2024 - 09:24 |
