Link su menu immagine

[domenico127]

Salve! Ho bisogno di un grande aiuto! Ho preparato il menu per un sito che consiste in una immagine in formato .jpg che contiene delle parole in successione. A ognuna di queste parole vorrei dare un collegamento, ma essendo un'immagine non so come fare. Potete aiutarmi?

Grazie

[ImSoTech]

ciao usi un qualche programma per creare il sito?

[Rumez]

devi usare le aree attive..o <map>...in Dreamwever ci sono di sicuro, anche in FrontPage mi pare di averle viste...se usi altri programmi però non so..

[domenico127]

Uso Dreamweaver.

P.S.: non vi ho detto una cosa, immagine di cui vi parlo è sattata come sfondo di un div.

[ImSoTech]

io lo so fare quando non è uno sfondo ma è un img....

[Boo]

io lo so fare quando non è uno sfondo ma è un img....

anche perché se è uno sfondo non si può mappare.

[domenico127]

Ok. Con un'immagine normale come si fa?

[Boo]

Codice: Seleziona tutto

<img id="id" src="" usemap="#id" alt="" />
<map id="id" name="id">
<area shape="rect" coords="0,0,0,0" href="" alt="" />
</map>

dichiari l'immagine, e gli dai un ID e un usemap (uno per Firefox/Opera, uno per IE)
poi crei il tag map e metti id e name (uno per Firefox/Opera, uno per IE)
poi ogni area deve avere una forma (in questo caso rettagolare) le coordinate (sinistra, sopra, lunghezza, altezza), un collegamento ipertestuale ed un testo alternativo.

Il calcolo generalmente lo faccio manualmente.

[ImSoTech]

con dreamweaver inserisci l'immagine e poi in basso a sinistra nelle proprietà se non erro ci sono 3 forme rettangolo, cerchio...Ne scegli una cliccandoci e poi inizi a disegnare la forma sul area interessata. Fatto ciò selezioni la forma con la freccetta e in basso nelle proprietà metti il link...

[domenico127]

Grazie ad entrambi!

Ho utilizzato però la procedura illustratami da ImSoTech, perché non so calcolare le coordinate!

[Boo]

Basta editare l'immagine con un qualsiasi programma di grafica (anche MS paint) e prendere le coordinate, per il cerchio le coordinate sono tre: sinistra, alto, raggio.

[domenico127]

Ciao a tutti! Mi è sorta un'altra domanda relativa sempre al topic. Vorrei sapere se sulle scritte-link dell'immagine si potesse creare un effetto a:hover.
Praticamente al passaggio del mouse sulle scritte calde queste dovrebbero cambiare colore. E' possibile farlo?

Grazie

[Boo]

è possibile ma diventerebbe complicato con un'immagine mappata, con una singola invece basta impostare tutte le immagini di link come background così che passando il mouse sopra l'immagine venga cambiata.