Sfumatura in alto e img in basso fissa, si può?

[blufragola]

Ciao.

Volevo chiedere una cosa strana:

secondo voi è possibile far coesistere un gradiente al top della pagina, che si sposta con lo scorrimento (classico background del body ripetuto orizzontalmente) e un'immagine, tipo un logo, che rimanga fissa in basso a destra anche se scrollo la pagina?

In teoria non si può fare perchè questa seconda immagine dovrebbe essere un altro sfondo del body, fixed in basso a destra...

C'è un modo per aggirare l'ostacolo?

Grazie mille

[pierofix]

Lo sfondo più 'profondo' lo metti all'elemento html e lo ripeti orizzontalmente, mentre il logo lo metti come sfondo di body e lo mantieni fisso in alto. Non ho mai provato ma dovrebbe funzionare.

html { background:url('sfondo.png') repeat-x 0 0 }
body { background:url('logo.png') no-repeat fixed 0 0 }

[blufragola]

Ciao. Purtroppo così non funziona...

Ma credo di aver trovato una scappatoia.
Nel body ho inserito l'immagine che dovrà assumere posizione "fixed".
Ho inserito un <div id="extradiv101"></div> vuoto nel mio HTML, esterno a div#container e appena prima della chiusura del </body>: gli ho dato larghezza 100%, l'ho posizionato in alto a sinistra in maniera assoluta, l'ho messo ad un livello sottostante quello del div#container, e gli ho assegnato l'immagine con il gradiente.

Ecco il codice:

body {background: #99CBFF url(grafica/fix_bg.jpg) 820px bottom no-repeat fixed }

div#extradiv101 {position:absolute ; left:0; top:0; width: 100% ; height:222px; background: url(grafica/sfum.jpg) left top repeat-x; z-index:0 }
/*uso questo div extra, esterno al div#container, per creare un gradiente in alto nella pagina, poichè body ha già un'immagine di sfondo (fixed)
gli assegno una position:absolute e uno z-index:0 per spostarlo al di sotto del div#container che avrà una position:relative e z-index:1 o superiore*/

div#container {position: relative; z-index:1}


Funziona, su IE6, su Firefox e su Opera.

Ciao