Salve a tutti,
avrei bisogno di creare un layout (possibilmente senza usare tabelle) per un sito che sto facendo utilizzando i div. Ma ho alcuni problemi.
Devo realizzare 2 menu uno dentro l'altro, quello interno è composto da delle miniature di immagini (oppure dei link) e da un div più grande che conterrà l'immagine a maggiore risoluzione con una breve descrizione.
Il menu esterno, invece, permette di visualizzare diversi menu interni a seconda delle tipologie di immagini.
Personalmente sono riuscito a fare quello interno: ho un div che rappresenta la sidebar con le immagini e tanti div quante sono le immagini (tutti sovrapposti). Il click su un'immagine richiama una funzione che, attraverso l'attributo z-index, permette di mettere in evidenza l'immagine cliccata e nascondendo gli altri div.
Il problema è che non sono riuscito ad estendere il concetto anche al menu esterno.
Per creare il menu interno ho utilizzato questo codice HTML:
e il relativo CSS:
I colori di sfondo mi servono per capire meglio le posizioni.
Se volessi creare un altro div di classe 'container' e chiamarlo interno2, in modo che sia sovrapposto a interno1 e venga visualizzato con lo stesso procedimento come dovrei fare?
Il problema è negli attributi position che mi stanno facendo dannare.
Preferisco non usare più tabelle, però se non risolvo al più presto sarò costretto. :incazz:
avrei bisogno di creare un layout (possibilmente senza usare tabelle) per un sito che sto facendo utilizzando i div. Ma ho alcuni problemi.
Devo realizzare 2 menu uno dentro l'altro, quello interno è composto da delle miniature di immagini (oppure dei link) e da un div più grande che conterrà l'immagine a maggiore risoluzione con una breve descrizione.
Il menu esterno, invece, permette di visualizzare diversi menu interni a seconda delle tipologie di immagini.
Personalmente sono riuscito a fare quello interno: ho un div che rappresenta la sidebar con le immagini e tanti div quante sono le immagini (tutti sovrapposti). Il click su un'immagine richiama una funzione che, attraverso l'attributo z-index, permette di mettere in evidenza l'immagine cliccata e nascondendo gli altri div.
Il problema è che non sono riuscito ad estendere il concetto anche al menu esterno.
Per creare il menu interno ho utilizzato questo codice HTML:
Codice:
<div id="interno1" class="container">
<div class="menu">
--- menu con i link o le immagini ---
</div>
<!-- l'ultimo creato è il primo visualizzato -->
<div id="1" class="immagine">IMMAGINE1</div>
<div id="2" class="immagine">IMMAGINE2</div>
</div>
e il relativo CSS:
Codice:
.container
{
position:relative;
}
.immagine {
top:0;
right:0;
width:auto;
background-color:#CCFF33;
position:absolute;
}
.menu
{
width:auto;
background-color:#0099FF;
position:relative;
}
I colori di sfondo mi servono per capire meglio le posizioni.
Se volessi creare un altro div di classe 'container' e chiamarlo interno2, in modo che sia sovrapposto a interno1 e venga visualizzato con lo stesso procedimento come dovrei fare?
Il problema è negli attributi position che mi stanno facendo dannare.
Preferisco non usare più tabelle, però se non risolvo al più presto sarò costretto. :incazz:
Allegati
Ultima modifica: