resize image sfondo

[vecchiosetter]

vi chiedo un aiuto, avrei bisogno di inserire un'immagine di sfondo a tutta pagina con resize in base alla risoluzione dello schermo.
nella pagina ho un div con width 100% con l'immagine, ho visto online qualche jquery ma non fa al caso mio perchè adatta l'immagine in larghezza ed altezza distorcendola.
io invece vorrei ridimensionarla solo in larghezza mantenendone le proporzioni... in altezza l'eccedenza ha sfondo bianco
ringrazio in anticipo chi mi vuol aiutare, è urgente

p.s. nel progetto per altro uso jquery 1.7.1

[Xinod]

usa supersized, ti basta il core, settando fit_portrait a 0 e fit_landscape a 1
ciao

[Enzaccio]

nella pagina ho un div con width 100% con l'immagine, ...

e all' immagine pure ci dai il width 100% MA la height fissa in pixel !

Stiamo parlando del body versione due DIV sovrapposti (absolute); quello sotto contiene l' immagine di sfondo ma come contenuto, non come sfondo; suppongo. Perché se invece, la supposta è sbagliata ... può essere pericoloso.

[vecchiosetter]

per xinod... l'ho visto ma non va bene perchè è l'iimagine viene come sfondo del body e non scrolla con il contenuto della pagina.

per enzaccio.. non ci ho capito nulla

credo di non essermi spiegato bene, ci riprovo.

immaginate questa pagina:

div header (width 100% height 200px background #333333)
div cnt (width 100% background #ffffff)
div footer (width 100% height 400px background #333333)

nel div cnt, di altezza variabile in base al contenuto della pagina voglio mettere in div (width 100%) con l'immagine (che sia come sfondo o contenuto è indifferente) ed a seguire altri div con testo (width 980 centrati) con lo sfondo bianco del cnt

la pagina quindi deve avere una fascia grigia dell'header, l'immagine a tutta larghezza (e di altezza in proporzione) sotto l'immagine il testo da 980 centrato con lo sfondo bianco del cnt e poi in fondo il mio foooter grigio!

se il div con il testo deve stare in basso all'immagine, non posso farli absolute... perchè ridimensionando l'immagine non posso posizionarlo ad un'altezza definita

[vecchiosetter]

piccola precisazione.. ovviamente di ridimensionarsi anche il div che la contiene, in modo da fr scendere i div in basso

[Enzaccio]

Originariamente inviato da vecchiosetter
per enzaccio.. non ci ho capito nulla

Il principio di quello che intendevo è questo:

<div style="position: absolute; top: 0px; width: 100%; height: 100%; border: 1px dotted blue; background-color: yellow">
 
</div>


<div style="position: absolute; width: 100%; height: 100%; border: 1px dashed red; vertical-align: middle">
 Ciao, sono enzino: mi presto a fare da contenuto del DIV ma c'è tanta gente che mi vuole male ...
</div>

e sì, lo sfondo scrolla assieme alla pagina.
Scusami, non ho tempo stamattina.
Domani rileggo meglio (decripto) la tua visione mistica.

[vecchiosetter]

semplifico la decriptazione...
faccio un layout fluido, nella pagina dall'alto verso il basso:

div header width 100% height 200px
/div header
div cnt width 100% background #fff
div foto width 100%
/div foto
div testo width 980px centrato
/div testo
/div cnt
div footer
/div footer

voglio fare il resize della foto in modo che stia a tutta larghezza schermo e mantenga le proporzioni, ovvio che in base alle dimensioni della stessa il div testo sta più in alto o più in basso, sempre sotto alla foto...
p.s. tutto segue il normale scroll della pagina

[cavicchiandrea]

Non ho letto tutto e capito benissimo cosa "dovresti" fare mi limito a questo passaggio

Originariamente inviato da vecchiosetter
per xinod... l'ho visto ma non va bene perchè è l'iimagine viene come sfondo del body ....

Per quanto ne so non puoi in js ridimensionare una immagine di sfondo, o gli dai dimensioni "predefinite" lato server (php o asp) oppure rivedi il progetto e simuli un div contenitore e giochi con i css con posizione assoluta e z-index per le profondità.
Non credo ci siano altre soluzioni, ma potrei sbagliare.

[vecchiosetter]

per andrea... ma come faccio con php a dargli una dimensione che non conosco?

se non avete voglia di capire il mio layout la faccio più semplice: immaginate una pag con un div (relative, width100%) con una foto
come faccio perchè la foto si ridimensioni in larghezza, come il div, allo schermo? e naturalmente anche in altezza mantenendone le proporzioni...
per intenderci il div 100% prende la larghezza dello schermo, la foto con la stessa larghezza del div e l'altezza in proporzione, quindi i div di testo che ci stanno sotto salgono o scendono in base alla visualizzazione della foto.
come faccio ad inserire un immagine qui? magari mi spiego meglio

[cavicchiandrea]

Originariamente inviato da vecchiosetter
per andrea... ma come faccio con php a dargli una dimensione che non conosco?

...

Al caricamento della pagina (onload) con una chiamata ajax indichi al server le dimensioni dello schermo e lato server esegui il ridimensionamento, non è il massimo ma come si dice... per i miracoli ci stiamo attrezzando
Come già detto per quanto ne so non puoi ridimensionare una foto di sfondo che sia il body o un div con javascript o jquery, tutto il resto è relativo, poi se trovi la possibilità di rimensionare una foto di sfondo credo che la comunità tutta ti sarà grata (anche gli svolgiati)