Coordinazione immagini

Ricky80

Nuovo Utente
10 Apr 2021
5
0
1
Ciao a tutti, sto cercando un buon modo per unire tra loro più parti della stessa immagine così da ricreare l'originale.
In pratica ho un immagine irregolare con una grossa parte trasparente, questa trasparenza si sovrappone ad elementi del sito con cui l'utente deve poter interagire.
Così ho deciso di scindere l'immagine in sotto parti così da utilizzare solo lo spazio minimo e non quello totale che occuperebbe l'immagine se fosse tutta unità.
Ora il quesito è come poter creare una sorta di mappa immagine direttamente col codice così che i vari sotto elementi si amalgamino in un unico elemento e che si ridimensioni in modo proporzionato all'ingrandimento e o ridurre della pagina web.
 
In alternativa sto pensando ad un modo per poter agire attraverso la trasparenza di un immagine.
 
Ciao, più che frammentare l'immagine, potresti usare la proprietà css "pointer-events: none" da applicare all'elemento immagine o all'eventuale suo contenitore che copre gli elementi della pagina. Questa regola fa in modo di "bypassare" gli eventi del mouse permettendo quindi l'interazione con gli elementi sottostanti.

Prova è fai sapere se può andare bene.
 
  • Like
Reactions: Ricky80
Ciao WmbertSea, appena provata questa proprietà, funziona alla meraviglia per quello che avevo in mente. Era da giorni ormai che ci sbattevo la testa su questa cosa qui. Ti ringrazio molto!
 

Discussioni simili