image fondo adattato a tutto gli schermi

**Tristal** · 15-11-2011, 12:01

Salve a tutti, sto preparando un fondo per un sito, ho una immagine a sx dello schermo...su un monitor 1680x1050 vedo perfettamente l'immagine, se apro il sito su un monitor 1200x768 l'immagine mi viene tagliata e quindi non vedo nulla....quale stringa devo inserire x poter vedere l'immagine adattata su tutti i monitor? Senza deformarla...

Sto creando il sito in dreamweaver, per chiamare l'immagine uso:

<body background= "image.jpg">

**Gas75** · 15-11-2011, 13:07

Senza deformarla la vedo dura: se su un monitor è 16:9, a prescindere dalla risoluzione, lo sfondo si vede correttamente, su un 4:3 no, e viceversa.

Per ottenere un risultato simile a quello che desideri, cioè sfondo non tagliato nè ripetuto, e sempre adattato alla finestra del browser, ti serve un Javascript, tipo fixedbackground.js che a suo tempo scaricai su www.web-link.it
Vai qui http://www.web-link.it/scripting/scripting.htm e quello che ti serve è l'E10.

**Tristal** · 23-11-2011, 18:57

Grazie mille!!! Devo solo cercare di adattarlo al mio sito!!!

**slegolego** · 23-11-2011, 19:44

Un altro metodo che puoi usare senza mettere in mezzo JS e' questo
inserisci la tua immagine come prima cosa subito dopo il tag BODY

codice:

[img]images/bg.jpg[/img]

e poi aggiungi questo nel CSS

codice:

/*BACKGROUND SCALABLE IMAGE*/
img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
	z-index:-1;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
        img.bg {
                left: 50%;
                margin-left: -512px;   /* 50% */
								z-index:-1;
        }
}

Prova a ridimensionare la finestra e a vedere il comportamento dell'immagine di sfondo.
Inoltre calcola che molti schermi ancora stanno a1024 px di risoluzione e non vedono praticamente nulla al di la dei 960-980 pixel di larghezza del contenuto principale.

Cheerio

**Tristal** · 24-11-2011, 10:23

grazieeee!!!!

Discussione: image fondo adattato a tutto gli schermi

Strumenti discussione

Ricerca discussione

Visualizza

image fondo adattato a tutto gli schermi

Permessi di invio