immagine di sfondo estesa :/

[bruno-]

Prova a togliere cover, che alla fine darà un effetto sgradevole.

L'immagine di sfondo mettila così:

body{
   background-image: url(sfondo.gif);
   background-repeat: repeat; 
}

[hal.dll]

Prova a togliere cover, che alla fine darà un effetto sgradevole.

L'immagine di sfondo mettila così:

body{
   background-image: url(sfondo.gif);
   background-repeat: repeat; 
}

grazie a entrambi a quanto pare mancava solo da settare l'id per lo sfondo.. ho aggiunto id="" e body prima della parentesi {

[Shores]

Prova a togliere cover, che alla fine darà un effetto sgradevole.

L'immagine di sfondo mettila così:

body{
   background-image: url(sfondo.gif);
   background-repeat: repeat; 
}

Scusa, ma se quel che ha chiesto è di avere un background esteso a tutto lo sfondo, tu gli rispondi di non metterlo? Anche a me non piacciono, ma non mi sembra una gran risposta...

In più se sfondo.jp non è nella stessa cartella del foglio di stile, come pensi che il tuo codice possa funzionare?

[hal.dll]

Scusa, ma se quel che ha chiesto è di avere un background esteso a tutto lo sfondo, tu gli rispondi di non metterlo? Anche a me non piacciono, ma non mi sembra una gran risposta...

In più se sfondo.jp non è nella stessa cartella del foglio di stile, come pensi che il tuo codice possa funzionare?

il fatto è che si tratta di un immagine davvero piccola, per questo preferivo scalarla.. di solito non le scalo mai.

[Shores]

Ribadisco che abbiamo bisogno di vedere un link online per poterti aiutare di più!

[Shores]

Perdonatemi, ma qui mi sa che non stiamo usando la stessa lingua:

ESTENDERE a tutta la pagina = allungare e/o allargare perchè ricopra tutto lo sfondo della pagina

Se il significato era questo, allora background-repeat:repeat; è SBAGLIATO perché richiede al browser di RIPETERE l'immagine di sfondo più volte come fosse una piastrella ricoprendo l'intero sfondo della pagina, e non di ALLARGARE UNA SOLA immagine fino a ricoprire tutto lo sfondo.

Detto questo, il primo esempio che posti è PESSIMO: perchè tirare il ballo addirittura un javascript attivato sull'onload della pagina per fare qualcosa che si può fare perfettamente con due righe di css, non lo capirò mai.

Il secondo esempio che hai postato funziona, ed infatti è sostanzialmente quello che gli avevo già indicato, con l'aggiunta delle varianti browser specific.

Il tuo consiglio finale è e rimane SBAGLIATO.

Senza contare che consigliare di spostare un'immagine solo per non scrivere la url giusta nel css è ridicolo!

[bruno-]

Scusa, ma se quel che ha chiesto è di avere un background esteso a tutto lo sfondo, tu gli rispondi di non metterlo? Anche a me non piacciono, ma non mi sembra una gran risposta...

Forse non ha capito. Dovrebbe prima provare come ho postato io.

Col mio codice, l'immagine verrà scalata in modo che si estenda perfettamente ai lati dello schermo.

In più se sfondo.jp non è nella stessa cartella del foglio di stile, come pensi che il tuo codice possa funzionare?

La sposta.


@hal.dll
Guarda che se entra nel sito un visitatore con una risoluzione diversa da quella dell'immagine di sfondo, esce un'effetto bruttissimo.







Vuoi qualcosa tipo questo:
http://pkspritesearch.altervista.org.../fix/filr.html
(Prova a ridimensionare la finestra)

O come questo:
http://pkspritesearch.altervista.org.../fix/filx.html
(Il secondo è più simile a quello postato da te)


Il source del primo esempio è

<script>var backgroundset=false;   
function fixedBackground(url)
  {
    if(!backgroundset)
    {
      document.body.style.overflow = 'hidden';
      document.body.style.padding  = '0px';
      document.body.style.margin   = '0px';

      var overlay = document.createElement('DIV');
      overlay.style.position    = 'absolute';
      overlay.style.top         = '0px';
      overlay.style.left        = '0px';
      overlay.style.height      = '100%';
      overlay.style.width       = '100%';
      overlay.style.overflow    = 'auto';

      overlay.innerHTML         = document.body.innerHTML;
      document.body.innerHTML   = '<img id="background" height="100%"  width="100%" src="' + url + '" style="left: 0; bottom: 0; right: 0; top: 0; z-index: 0" />';

      document.body.appendChild(overlay);

      backgroundset=true;
    }
    else
      background.src=url;
  }</script>
  <body onload="fixedBackground('sfondo.png')">

Quello del secondo :

<style>* { margin: 0; padding: 0; }
     
    html {background: url(sfondo.png) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
</style>

Spero di aver risolto.


Il mio consiglio rimane comunque

body{
   background-image: url(sfondo.gif);
   background-repeat: repeat; 
}