Inserire HTML su un immagine...

**stefanodj** · 24-12-2007, 11:05

Salve, sono nuovo di questo mondo e sto presto imparando html e php

Sto realizzando un mio sito web, www.informale.tv dove io vorrei fare una semplice mappa d'immagini che mi si ricollega ad altre pagine...fino qui tutto ok.

Le mie domande (banali) sono....posso mettere un popud nella mappa d'immagine? ; cioè quando clicco posso far aprire un popud?
Uso dreamweaver....

Altra domanda banale ma di molta importanza è:
Il sondaggio in basso lo posso mettere sull'mmagine in una particolare posizione?

Vi ringrazio Anticipatamente. Saluti

**Mega69** · 24-12-2007, 11:39

Si può fare, ma penso che tu lo voglia fare per il motivo sbagliato. Praticamente devi inserire in ogni tag area un onclick dove invochi window.open:

codice:

<area href="link.htm" target="nomeWindow" shape="xxx" coords="xxx" onclick="window.open(this.href,'nomeWindow','width=500,height=500'); return false;" />

**stefanodj** · 24-12-2007, 14:47

Il sondaggio in basso lo posso mettere sull'mmagine in una particolare posizione?

**Mega69** · 24-12-2007, 19:27

La seconda non l'avevo vista...
Si può fare con i css:

codice:

#poll {
  position:absolute;
  left:xpx;
  top:ypx;
}

Dove x e y sono le coordinate dove posizionare l'elemento

**stefanodj** · 25-12-2007, 12:46

come inserisco l'oggetto nel css?
nel senso se ho un imagine che si chiama "pippo.gif" e la devo mettere su "home.jpg" uso i css....ma come? come integro nel codice html i css? nel css che tu hai postato come definisco il nome dell'immagine?

**Mega69** · 25-12-2007, 12:55

Ti conviene ripassare le basi, leggiti su HTML.it la guida al css.

codice:

<style type="text/css">
#poll {
  position:absolute;
  left:xpx;
  top:ypx;
}
</style>

Mettitlo in head.
#poll si riferisce all'elemento che contiene il sondaggio, infatti l'elemento ha l'attributo id="poll".
Non c'è bisogno di riferirsi all'immagine home.jpg.

**stefanodj** · 25-12-2007, 13:59

Scusami la mia ignoranza.......

allora metto codice:

codice:

<style type="text/css">
#poll {        <-----qui metto l'immagine?
  position:absolute;
  left:xpx;  <---- le cordinate come le posso calcolare?
  top:ypx;
}
</style>

**Mega69** · 25-12-2007, 20:53

Non capisco, di quale immagine parli?
Le coordinate mettile all'ammuzzo e fai vari tenativi finchè non trovi quelle giuste. Oppure puoi usare l'estensione MeasureIt per Firefox.

**stefanodj** · 27-12-2007, 11:10

Non capisco, di quale immagine parli?
Le coordinate mettile all'ammuzzo e fai vari tenativi finchè non trovi quelle giuste. Oppure puoi usare l'estensione MeasureIt per Firefox.

Allora questo è il codice html dellla pagina...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body text=FFFFFF></body>
<title>Informale.tv</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body background="images/sfondo.jpg">
</body>
<center>[img]images/one.jpg[/img]</center>

<center>

<style>
#poll {padding: 0px; margin: 0px; width: 200px; font-family: Comic Sans MS; font-size: 12px; color: #000000; background-color: #AEEEEE; border: 1px solid #0000FF; text-align: center}
#poll .head {width: 96%; border-bottom: 1px dashed #000000; font-size: 14px; font-weight: bold}
#poll .foot {width: 96%; border-top: 1px dashed #000000}
#poll a, a:hover, a:active, a:visited {color: #000000; text-decoration: underline}
#poll form {margin: 0px}
#poll input, select, textarea, td {font-family: Comic Sans MS; font-size: 12px}
#poll input.bt {font-weight: bold; background-color: #FFCC00; color: #000000; border: 1px solid #000000; margin: 4px}
</style>
<div id="poll">
<div class="head"><div style="padding: 2px">Partecipa al Sondaggio!</div></div>
<div style="padding: 4px">
<form method="POST" action="http://tools.mrwebmaster.it/work/poll.php">
<input type="hidden" name="poll_id" value="13901">
<table border="0"><tr><td colspan="2">Cosa ne pensate della Nuova Ztl istituita dal Comune di Alessandria ?</td></tr>
<tr><td align="right"><input type="radio" name="myvote" id="mv1" value="1"></td><td><label for="mv1">E' Utile</label></td></tr>
<tr><td align="right"><input type="radio" name="myvote" id="mv2" value="2"></td><td><label for="mv2">Non So</label></td></tr>
<tr><td align="right"><input type="radio" name="myvote" id="mv3" value="3"></td><td><label for="mv3">Andrebbe Modificata</label></td></tr>
<tr><td align="right"><input type="radio" name="myvote" id="mv4" value="4"></td><td><label for="mv4">Non mi piace proprio</label></td></tr>
<tr><td>Risultati</td><td align="right"><input type="submit" value="VOTA!" class="bt"></td></tr></table>
</form>
</div>
<div class="foot"><div style="padding: 2px">by Mr.Webmaster</div></div>
</div>

</center>

<center>

<script type="text/javascript" language="JavaScript" src="http://codice.shinystat.com/cgi-bin/getcod.cgi?USER=stefanodj"></script>
<noscript>
<a href="http://www.shinystat.com/it" target="_top">

</a>
</noscript>

</center>

</html>

Come vedi io do un immagine di sfondo e subito dopo metto sopra allo sfondo un'immagine dove farò i collegamenti con i vari link.
La mia domanda è posso inserire sopra l'immagine che metto, in questo caso one.jpg, del codice html?
Tu hai detto di si, con i css ma come??
Considera che io devo mettere il sondaggio su una parte dell'immagine questo è il sorgete:

Come faccio?

**Mega69** · 27-12-2007, 12:21

Attento, il codice html resta così come è. Non ho detto assolutamente che puoi mettere dell'html dentro un tag img, quello che ho detto io è che puoi decidere le coordinate assolute di un elemento.
Ciò che fa il posizionamento assoluto è di rappresentare l'elemento in una certa posizione assoluta, senza doversi preocupare dove questo elemento è nell'html ( fatta eccezzione se il contenitore ha position relative, absolute o fixed ).
In ogni caso mi pare che la discussione stia degenerando verso l'argomento css.

Discussione: Inserire HTML su un immagine...

Strumenti discussione

Ricerca discussione

Visualizza

Inserire HTML su un immagine...

Permessi di invio