area shape per template responsive

[ANTONIO76]

Buongiorno a tutti!


lavoro con l'ultima versione di joomla su un template responsive.


ho bisogno di inserire una immagine con area shape.


se inserisco il normale codice quando l'immagine si rimpicciolisce per via dei vari device le coordinate cambiano e quindi il risultano non è corretto.


questo è quello che intendo per normale codice:

Codice: [Seleziona]

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">


<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

Ho trovato il seguente codice da applicare, ma non so dove andare a posizione il codice js.
https://codepen.io/maddesigns/pen/zKudB


Potete aiutarmi?
Grazie mille!