Neka cijeli Div bude kliktan - CSS-trikovi

Anonim

Ažuriranje u studenom 2020 .: Mislim da je najbolja moguća tehnika za to metoda 4 u ovom članku. (Ili što god omot elementa) ostaje semantičke i dostupni, a da je „kliknuti” na cijelom području. Ne narušava odabir teksta i poštuje ostale "ugniježđene" interaktivne elemente.

Ovo je savršeno valjani HTML:

 anything 

I ne zaboravite da možete stvarati veze display: block;, tako da cijelo pravokutno područje postaje "klikljivo". Ali, ako je tu hrpa sadržaja, apsolutno je užasno za pristupačnost, čitav taj sadržaj kao interaktivnu vezu.

Ako apsolutno trebate koristiti JavaScript, jedan od načina je pronaći vezu unutar div-a i otići na njega hrefkad se div klikne. Ovo je s jQuery:

$(".myBox").click(function() ( window.location = $(this).find("a").attr("href"); return false; ));

Traži vezu unutar div s klasom "myBox". Preusmjeravanja na vrijednost tih veza kada se klikne bilo gdje u div-u.

Referentni HTML:

 blah blah blah. link 

Ili možete postaviti data-*atribut na i učiniti poput:

window.location = $(".myBox").data("location");