Au Café
Maggio 18, 2012, 04:35:00 am *
Benvenuto! Accedi o registrati.

Accesso con nome utente, password e durata della sessione
Notizia: Andrea e` in ferie per qualche giorno, scusate il ritardo nelle risposte!
 
   Indice   Aiuto Ricerca Accedi Registrati  
Pagine: [1]
  Stampa  
Autore Discussione: AIUTO: CREARE UNA CONTACT TABLE ORIZZONTALE  (Letto 1451 volte)
cla.easy
Newbie
*
Messaggi: 12


Mostra profilo
« inserita:: Marzo 05, 2009, 06:57:59 am »

Ciao, volevo gentilmente sapere i passi per creare una contact table orizzontale come quella sotto l'header di questo spazio

http://www.myspace.com/theelectricdiorama (uno dei più belli su myspace tralaltro)

Insomma vorrei sapere come rendere cliccabili alcune aree definitite nella top image. Ho provato a fare una immagine mappata con gimp ma poi quando inserisco il codice mi da "condizioni del servizio violate"

Boh... sicuramente avrò toppato qualcosa =P

Grazie.
Registrato
benia108
Moderator
Jr. Member
*****
Messaggi: 76



Mostra profilo WWW
« Risposta #1 inserita:: Marzo 10, 2009, 09:05:49 am »

sinceramente non so come si faccia come nello space che hai indicato, cioè penso sia tutto quanto creato come mappato, ti posso dire però come creare un mappato un po più piccolo, grande dunque come il menu che devi modificare.

Allora si apre l'immagine con Image Ready. dopodichè si taglia la parte interessata con il taglierino, che è quello strumento che sembra una penna, vi si aprirà una tabella dove dovrete mettere l'url il nome ecc.
intanto create una cartella apposita, fate "salva come" e selezionate "html e immagini", vedrete che salvandolo vi farà automaticamente una cartella con nome "immagini".
nella cartella che avete creato ci sarà un file html e nella cartella immagini i pezzi dell'immagine originale tagliuzzati.
Se aprite il file html con blocco note vi verrà fuori un tag di una tabella, lasciate perdere i metadati ecc prendete solo il tag da <table> a </table>. non vi resta che pubblicare i pezzi di immagini su un sito come imageshack.us e sostituire i link dei file pubblicati con quelli originali.
per esempio:

Da:
<tr>
   <td>
      <img src="immagine.jpeg" width="120" height="26" alt=""></td>

A:
<tr>
   <td>
      <img src="LINK FILE PUBBLICATO" width="120" height="26" alt=""></td>

Tutto il codice con i file pubblicati vi darà il vostro link mappato.



Spero di aver detto tutto.
Se hai problemi, o se non hai i software necessari, contattami tramite messaggio privato che vediamo se si può fare qualcosa.
Benia
Registrato
cla.easy
Newbie
*
Messaggi: 12


Mostra profilo
« Risposta #2 inserita:: Marzo 11, 2009, 08:06:02 am »

Grazie, grazie, grazie!!!

Intanto mi scarico Image Ready poi appena ho un goccio di tempo ci provo e ti faccio sapere.

Ciau



Registrato
ilnissardo
Administrator
Hero Member
*****
Messaggi: 709



Mostra profilo WWW
« Risposta #3 inserita:: Marzo 12, 2009, 06:05:12 am »

Nel profilo da te linkato la soluzione adottata e` anche la mia preferita. Se cerchi sul forum sono sicuro che se ne e` discusso tanto in altri post e in alcuni c'e` anche il codice completo.

Comunque per farla breve, tutto e` basato su una tabella messa dentro un div:

Codice:
<div class="Main">
<table id="Tabella_01" width="875" height="1103" border="0" cellpadding="0" cellspacing="0">
<tr>
                <!-- qui devi mettere un valore di colspan che sia uguale al massimo numero di colonne che hai -->
<td colspan="XX"><img src="IMMAGINE HEADER" border="0" width="875" height="179" alt=""></td>
<tr>
               <!-- nel profilo originale la dimensione delle celle per i bottoni era doppia rispetto alle celle normali  -->
<td colspan="2" rowspan="2">
<a href="LINK-PER-ADD-FRIEND">
<img src="IMMAGINE_ADD_FRIEND" width="71" height="36" border="0" alt=""></a></td>
<!-- stessa cosa per tutti gli altri bottoni
</tr>
       <!-- poi c'e' una marea di altra roba su questa tabella, video, feed tweeter, tu aggiungi quello che vuoi a fantasia tua -->
</table>
</div>

<!-- e il css che lo posiziona -->
div.Main {
position: absolute; top: 0; left: 50%; margin-left: -437px; width: 875px; height: 922px; z-index: 1;
}

Ovviamente devi avere un po di conoscenza delle tabelle in html, ma io lo preferisco di molto alle immagini mappate, tra l'altro e` molto piu` flessibile perche` ci puoi inserire di tutto dentro.
Registrato
cla.easy
Newbie
*
Messaggi: 12


Mostra profilo
« Risposta #4 inserita:: Marzo 17, 2009, 07:29:17 am »

Grazie, proverò il prima possibile Occhiolino
Registrato
Pagine: [1]
  Stampa  
 
Vai a:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.14 | SMF © 2006-2007, Simple Machines LLC XHTML 1.0 valido! CSS valido!