Padaryti spustelėjamą visą Div - CSS-gudrybės

Anonim

Atnaujinkite 2020 m. Lapkritį: manau, kad geriausia įmanoma šio metodo technika yra šio straipsnio 4 metodas. (Ar kas įvynioti elementas) lieka semantinis ir prieinama, būdami "spausti" per visą plotą. Tai nepažeidžia teksto pasirinkimo ir gerbia kitus „įdėtus“ interaktyvius elementus.

Tai puikiai tinka HTML:

 anything 

Nepamirškite, kad galite kurti nuorodas display: block;, todėl visa stačiakampio sritis tampa „spustelėjama“. Bet jei ten yra daugybė turinio, tai yra visiškai siaubinga dėl prieinamumo, visą tą turinį skaitant kaip interaktyvią nuorodą.

Jei jums tikrai reikia naudoti „JavaScript“, vienas iš būdų yra rasti nuorodą div viduje ir pereiti prie jos, hrefkai paspaudžiate div. Tai yra su „jQuery“:

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

Ieško nuorodos „div“ viduje su „myBox“ klase. Peradresuoja į tą nuorodų vertę, kai spustelėsite bet kurią vietą div.

Nuorodos HTML:

 blah blah blah. link 

Arba galite nustatyti data-*atributą ir tai padaryti:

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