Joomla.it Forum

Joomla! 1.5.x (versione con supporto terminato) => Joomla! 1.5 => I Template di Joomla 1.5.x => : nokiapep 07 Jul 2011, 23:57:07

: [RISOLTO] Posizione dentro posizione
: nokiapep 07 Jul 2011, 23:57:07
Buonanotte vorrei inserire una posizione dentro un'altra posizione... in modo che possa inserire un filmato flash a sfondo trasparente sovrapposto ad un altro modulo: per farmi capire potete vedere l'header di questo sito web www.ricambi.bloggangolo.com (http://www.ricambi.bloggangolo.com) (per questo sito mi è risultato facile farlo perchè il php del template era strutturato bene). Mentre per questo nuovo sito che sto creando la struttura del file è ben diversa.
 
 In grassetto è la posizione che ho aggiunto.
 Se per ricambi.bloggangolo il codice era questo
 
 <div id="header">
 <jdoc:include type="modules" name="flash" />                   
 <jdoc:include type="modules" name="slideshow" /> </div>
 
 Per quanto riguarda questo nuovo sito web: www.viaggi.bloggangolo.com (http://www.viaggi.bloggangolo.com) la struttura è ben diversa:
 
             <?php if($this->countModules('slideshow')) : ?>
            <div id="zt-slideshow" class="clearfix">
                <div class="zt-wrapper">
                    <div class="zt-wrapper-inner">
                            <div id="zt-slideshow-inner">
                                <jdoc:include type="modules" name="flash" />
                                <jdoc:include type="modules" name="slideshow" />
                        </div>
                    </div>
                </div>
            </div>
            <?php endif; ?>
                   
 Provando ad inserire quella parte di codice ho ottenuto che la posizione "flash" è subito sopra la posizione "slideshow"
 Mentre io vorrei che le 2 si sovraponessero.
 
 Spero di essermi riuscito a spiegare.
Qualcuno puo' dirmi come posso fare?? Grazie in anticipo a tutti.
: Re:Posizione dentro posizione
: giusebos 08 Jul 2011, 00:49:57
....Spero di essermi riuscito a spiegare.

Sinceramente io non ho capito.....tu hai due slideshow quello sopra e quello sotto.................uno di questi due deve stare sopra l'header in flash?
: Re:Posizione dentro posizione
: tomtomeight 08 Jul 2011, 07:56:32
Devi agire sul css dando le stesse misure alle due posizioni e poi le adatti coi margini affinché si sovrappongano.


: Re:Posizione dentro posizione
: nokiapep 08 Jul 2011, 09:54:06
Sinceramente io non ho capito.....tu hai due slideshow quello sopra e quello sotto.................uno di questi due deve stare sopra l'header in flash?

Sono due moduli in 2 posizioni differenti una "flash" e una "slideshow"... vorrei che queste 2 si sovraponessero

Per "tomtomfive" provo a fare quello che hai detto tu.
: Re:Posizione dentro posizione
: Npaquito 08 Jul 2011, 10:42:24
Hola

Se permettete la pignoleria:

...
 <div id="header">
 <jdoc:include type="modules" name="flash" />                   
 <jdoc:include type="modules" name="slideshow" /> </div>
 ...

Questa non è una posizione dentro posizione (cosa che non credo che si possa fare) ma due posizioni nello stesso div

Al nocciolo: come ha detto tomtom devi agire sul css ma, personalmente credo che sará piu facile inserendo le due posizioni in due div diversi giocando con position e con z-index
: Re:Posizione dentro posizione
: nokiapep 08 Jul 2011, 15:23:17
ho modificato in css. non ho fatto altro che copiare ed incollare il codice dello "slideshow", ma non so quali modifiche devo fare per sovrapporlo all'altra posizione.

/*****SLIDESHOW*****/
#zt-slideshow {
    margin: 0;
    width: 100%;
    z-index: 1;
    position: relative;
}
#zt-slideshow-inner {
    padding: 0;
    display: block;
}
/*****END SLIDESHOW*****/

/*****Flash*****/
#zt-flash {
    margin: 0;
    width: 100%;
    z-index: 1;
    position: relative;
}
#zt-flash-inner {
    padding: 0;
    display: block;
}
/*****END Flash*****/


questo invece è il codice del php
<!-- Prova inserimento nuova posizione "fòash" -->
<?php if($this->countModules('flash')) : ?>
            <div id="zt-flash" class="clearfix">
                <div class="zt-wrapper">
                    <div class="zt-wrapper-inner">
                        <div id="zt-flash-inner">
                            <jdoc:include type="modules" name="flash" />
                            </div>
                    </div>
                </div>
            </div>
            <?php endif; ?>
<!-- Fine nuova posizione -->

            <?php if($this->countModules('slideshow')) : ?>
            <div id="zt-slideshow" class="clearfix">
                <div class="zt-wrapper">
                    <div class="zt-wrapper-inner">
                        <div id="zt-slideshow-inner">
                            <jdoc:include type="modules" name="slideshow" />
                        </div>
                    </div>
                </div>
            </div>
            <?php endif; ?>

Quello che ottengo è sempre il "flash" sopra "slideshow"

questo è il risultato che vorrei ottenere www.ricambi.bloggangolo.com
: Re:Posizione dentro posizione
: Npaquito 08 Jul 2011, 16:20:20
Hola
 
 D'entrata cambia i z-index, metti 2 al modulo che vuoi sopra.
 
 Poi , perche

/*****SLIDESHOW*****/
#zt-slideshow {
    margin: 0;
    width: 100%;
    z-index: 1;
    position: relative;
}

#zt-flash {
    margin: 0;
    width: 100%;
    z-index: 1;
    position: relative;
}
..

se i moduli sono in <div id="zt-flash-inner"> e <div id="zt-slideshow-inner">?

P.S.: inoltre bisogna vedere se il flash non ti tira un colpo mancino, se non ti funziona prova con un'altro modulo flash o cambiando le impostazioni del swf
: Re:Posizione dentro posizione
: tomtomeight 08 Jul 2011, 17:38:43
Devi agire sui margini prova con firebug e gioca sui valori finchè si sovrappongono poi col zindex decisi chi deve stare sopra e chi sotto, ricorda che lo zindex funziona solo se ci dai anche il parametro position altrimenti non ha effetto.
: Re:Posizione dentro posizione
: nokiapep 09 Jul 2011, 10:27:08
Grazie a tutti... ho risolto il problema...
ho messo


#zt-flash {
    margin: 0;
    width: 100%;
     z-index: 2;                <---
    position: absolute;    <---
}

E tutto funziona ora. Ancora grazie.