Unofficial WebSite X5

WebSite X5 versioni obsolete => WebSite X5 [v9] - Discussioni Generali => Topic aperto da: mark00 - 09 Dicembre, 2012, 12:35:54

Titolo: Header a schermo intero
Inserito da: mark00 - 09 Dicembre, 2012, 12:35:54
 Vorrei realizzare una header a schermo intero ma inserendo il seguente codice :

<style>#imheader_bg{height: 150px; background: red url('res/bottom.jpg') no-repeat center; }#imheader{display: none}</style><div id="imheader_bg"></div>

visualizzo una barra a schermo intero ma sopra l'header....
Titolo: Re:Header a schermo intero
Inserito da: stesil - 09 Dicembre, 2012, 14:52:38
Ciao,

l'header resta visibile perchè il selettore corretto è imHeader.

Ma, anche effettuando questa correzione, l'header viene sì nascosto, ma il contenuto della pagina si sposta in alto, occupando lo spazio che prima era dell'header.

Sempre che io abbia capito quello che vuoi ottenere, potresti provare ad inserire il div "imheader_bg" in codice per attivazione delle statistiche e spostarlo poi verso l'alto con un css tipo questo:

#imheader_bg{
height: 150px;
background: red url('res/bottom.jpg') no-repeat center;
position:absolute;
width:100%;
top:0;
left:0;
}

L'header generato dal programma, invece, potresti provare a nasconderlo con #imHeader{visibility:hidden;} in modo che mantenga lo spazio nella pagina e che tutti i contenuti successivi non vengano coinvolti.

In alternativa si può agire anche esclusivamente sulla grafica, come indicato da Michele qui: http://www.unofficialwsx5.com/index.php?topic=758.msg5103#msg5103 (http://www.unofficialwsx5.com/index.php?topic=758.msg5103#msg5103)

Titolo: Re:Header a schermo intero
Inserito da: mark00 - 09 Dicembre, 2012, 18:14:22
La cosa potrebbe andar anche bene ma ciò che voglio ottenere è un header simile (http://www.studiofotograficolops.it/index.asp)
Titolo: Re:Header a schermo intero
Inserito da: Zambelletti - 09 Dicembre, 2012, 20:55:30
così?


http://www.unofficialwsx5.com/index.php?topic=163.0



Titolo: Re:Header a schermo intero
Inserito da: mark00 - 10 Dicembre, 2012, 09:04:47
Ciao e grazie ma Nn intendo maximage  mi occorre solo la parte dell'header......
Titolo: Re:Header a schermo intero
Inserito da: mark00 - 10 Dicembre, 2012, 12:54:19
Ho risolto col seguente codice ( postato da serzio in altro topic  (http://www.unofficialwsx5.com/index.php?topic=316.0)) per la larghezza:

 <style type="text/css">
body #imSite {margin: 0 auto;}
#imHeader {position: absolute; left: 0; width: 100%; }
</style>

 ed ho inserito una immagine trasparente che viene ripetuta in entrambe le direzioni e pare funzioni. Mi rimane riuscire a sovrapporre una immagine (logo) sull'header.




Titolo: Re:Header a schermo intero
Inserito da: skeggia - 10 Dicembre, 2012, 13:46:35
utilizza z-index:xx (xx= valore positivo) per posizionarti sopra all'header
Titolo: Re:Header a schermo intero
Inserito da: mark00 - 10 Dicembre, 2012, 15:28:28
ho provato cn questo ma nn va

<style type="text/css">
#imlogo {top: 150px; z-index:1; }
< style>
Titolo: Re:Header a schermo intero
Inserito da: milux - 10 Dicembre, 2012, 15:55:04
scusa ma non capisco perchè non puoi fare l'header a tutta larghezza con gli strumenti standard di X5 , usando una immagine da inserire nello sfondo ( Stesil ti aveva anche dato un suggerimento con un link). Poi nell'header metti l'immagine che vuoi..


[attach=1]

Titolo: Re:Header a schermo intero
Inserito da: mark00 - 10 Dicembre, 2012, 16:58:36
Il problema èche nel bg girano img in fullscreen ed il logo deve essere perforza sovrapposto all'header....vedi link di esempio (http://www.studiofotograficolops.it/index.asp)
Titolo: Re:Header a schermo intero
Inserito da: mark00 - 10 Dicembre, 2012, 17:52:17
RISOLTO!! con z-indez  ;) grazie ragazzi....
Titolo: Re:Header a schermo intero
Inserito da: skeggia - 10 Dicembre, 2012, 18:03:51
Bene, ad essere pignoli però, dovresti alzare di uno o due pixel il logo, in quanto non combacia perfettamente con la riga orizzontale blu a tutto schermo . . . non dire parolacce che ti sento . . . ciao ciao
sk