creare link su un box

[jerico]

E' possibile creare dei link su un box con il background di un immagine?

#news {
background: url(back_news.jpg);
width: 403px;
height: 333px;
position:absolute;
top: 155px;
left: 18px;

}

Praticamente lo sfondo sono delle immagini, e io vorrei fare dei link a quei marchi.
Vi ringrazio.

[fontlover]

se ho ben capito quello che vuoi devi usare una mappa, cioe'
creare delle aree definite sull'immagine alla queli aree assegnare dei link.
per individuare le coordinate in modo preciso puoi utilizzare appositi programmi che ti tirano fuori anche gia il codice.

ciao

http://download.html.it/categorie/st...ows/image-map/

---spero di aver compreso il quesito

[jerico]

Perfetto! Ti ringrazio. Dopo proverò a scaricare un pro!

[jerico]

Ho usato il programma percreare una mappa linkabile, ma in IE7 funziona, invece in firefox, non funziona, la freccia del mouse non diventa nemmeno manina....

Il codice con le coordinate l'ho inserito all'interno del tag div.

<div id="distri">
[img]distribuiamo.jpg[/img]
<MAP NAME="distribuiamo.jpg">
<AREA SHAPE=RECT COORDS="51,55,162,79" HREF="schumag.asp">
<AREA SHAPE=RECT COORDS="21,107,59,144" HREF="blohm.asp">
<AREA SHAPE=RECT COORDS="101,101,173,152" HREF="special.asp">
<AREA SHAPE=RECT COORDS="41,168,125,191" HREF="steinel.asp">
<AREA SHAPE=RECT COORDS="49,230,111,249" HREF="zecha.asp">
<AREA SHAPE=RECT COORDS="175,233,247,266" HREF="tipco.asp">
<AREA SHAPE=RECT COORDS="94,283,179,307" HREF="progressive.asp">
</MAP>
</div>

Che fare?

[fontlover]

testato il tuo codice su firefox 2.0.0.4 e va la mappatura anche se ovviamente nn vedo nulla. se avessi modo di mandarci il link della tua pagina in rete ci si guarda

[jerico]

Il sito stò cercando di costruirlo, non è in linea, comunque ho provato anche io a fare una pagina nuova vuota e la mappatura funziona. Non funziona in firefox nè il Div contenente la mappatura, ne quella contenente il form select.
Dove può essere l'errore!

/* per la mappatura*/
#distri {
background: url(distribuiamo.jpg);
width: 261px;
height: 328px;
position: absolute;
top: 155px;
left: 440px;
}
/* per il form*/
#ricerca {
background: url(back_ricerca.jpg);
width: 180px;
height: 204px;
text-align: center;
position: absolute;
top: 155px;
right: 16px;
}


Dopo nel body.....


<div id="distri">
[img]distribuiamo.jpg[/img]
<MAP NAME="distribuiamo.jpg">
<AREA SHAPE=RECT COORDS="51,55,162,79" HREF="schumag.asp">
<AREA SHAPE=RECT COORDS="21,107,59,144" HREF="blohm.asp">
<AREA SHAPE=RECT COORDS="101,101,173,152" HREF="special.asp">
<AREA SHAPE=RECT COORDS="41,168,125,191" HREF="steinel.asp">
<AREA SHAPE=RECT COORDS="49,230,111,249" HREF="zecha.asp">
<AREA SHAPE=RECT COORDS="175,233,247,266" HREF="tipco.asp">
<AREA SHAPE=RECT COORDS="94,283,179,307" HREF="progressive.asp">
</MAP>
</div>

<div id="ricerca">
<form id="form1" name="form1" method="post" action="">
<label>Categorie


<select name="select">
</select>
</label>
</form>
</div>

[fontlover]

Non so che versione hai di firefox.. lo conosco poco cmq sulla mia 2.0.0.4 funziona bene
io vedo questo , se questo e' cio' che vuoi ottenere

http://i15.tinypic.com/4py64o0.jpg

a me la mappa va (anche su Opera)

diversamente se proprio nn ti funziona , ma il codice nn mi pare abbia problemi,
xche nn abbandonare la mappa e creare il box con una lista "ul" utilizzando delle immagini (ovvero le stesse che fungono da link),sotto metti lo stesso sfondo della tua mappa e diciamo che puoi rcostruire la stessa cosa anche senza mappe.

nn so xche nn ti funziona ..

[jerico]

La versione è la medesima. Non ho prevosto immagini allineate per creare un elenco. Sono loghi aziendali messi in modo randon.