Fascia colorata scrool 
Author: Fabrizio L.Buongiorno.
Premetto che non sono un programmatore "web", abbiate pazienza, ma sono curioso.
Ho un problema. Leggendo diversi post e scaricando alcuni template mi sono incuriosito su un aspetto : mantenere il menu fisso (e questo wbsite lo fa) e scrollare le pagine sotto al menu , ma non solo , anche sotto lo "sfondo dell'intestazione" lasciando lo "sfondo pagina" fermo.Ci sarei riuscito(vedi link : http://www.giochidifabry.it/test/ ). Il problema è che sotto al footer aggiunge pixel in più.
Il nero è stato creato dal div (copiato da un template creato con website) inserito prima della chiusura del tag head:
<div style="background-color:#000000; position: absolute; left:0px; width:100%; top:200px; height:100%; "></div>
Lo spazio nero in più si basa su quei 200px inseriti al "top" che vengono aggiunti in fondo ? Come faccio a far terminare il nero sempre all'altezza del footer indipendentemente dalla lunghezza della pagina ? Spero di essere stato chiaro.
Grazie e Buon Lavoro
i Div non andrebbero in Head, ma dopo l'apertura del tag body....
Author
Ciao Mirco. Lo sposto dopo l'apertura del tag body e ripubblico il sito in test.
Author
Fatto
Ciao Fabrizio,
non ho capito bene cosa tu voglia fare e forse ci sono altri metodi, comunque lo spazio di 200px sotto il footer è proprio dovuto all'altezza 100% assegnata al div che è posizionato a 200px dall'alto.
Puoi provare in questo modo:
height: calc(100% - 200px);
Author
Ciao Stesil , grazie per il suggerimento.Domani sera provo e ti faccio sapere
Secondo te guardando il codice lo scrool del sito sotto al menu/head è corretto oppure si possono generare errori ? Quelle poche righe inserite le ho riprese da vari post letti su website answers. Certo che una funzionalità di questo tipo parametrizzata "dentro" il software non sarebbe male.
Author
Per Stesil - Sicuramente ci sono altri metodi e sicuramente molto più puliti o sofisticati o che mi sfuggono sfuttando WebSite. Io volevo solo avere quella fascia nera (che poi diventerà bianca) che scrollasse insieme alla pagina sotto al menu e allo sfondo intestazione (fixed) , mantenendo lo sfondo pagina fixed il tutto con pagina di 960px... Niente più.
Ho scritto "forse ci sono altri metodi" ma la tua soluzione è pulita, quindi, se il risultato ti soddisfa, non cercare altro.
L'unica cosa da considerare è che la funzione CSS calc() non è supportata dai vecchi browser (IE8 e precedenti). Potresti trascurare la cosa (io lo farei), del resto non crea problemi di fruibilità dei contenuti, ma solo un aspetto non conforme, ma chi usa ancora questi browser dovrebbe saperlo.
Se comunque tu volessi rendere il valore dell'altezza conforme in tutti browser, dovrai scrivere una funzioncina in javascript che calcola appunto l'altezza di quel div in modo dinamico ma, ripeto, secondo me non ne vale la pena.
se vuoi solo una fascia, e non tutta la pagina nera, secondo me non dovrebbe essere cosi:
height:100%;....ma dovresti inserire una misura esatta, es: height:300px;
Author
Stesil Funziona con il height:calc(100% - 200px); ---> (http://www.giochidifabry.it/test/). Non ho più i pixel sotto al footer. Ho aggiunto anche una immagine che aggiunge l'ombra nella parte bassa della striscia con i"bottoni" e che "scrolla" con la pagina. Spero che il codice inserito sia corretto.
Grazie
Author
Esportando il sito di test, purtroppo l'immagine aggiunta non si vede mentre in anteprima si. Ho fatto anche "ctrl F5" per ricaricare la pagina.
Sarebbe stato troppo bello.
C'è solo uno slash di troppo nel percorso del file.
Così dovrebbe funzionare url("files/pipo2.png") oppure con il percorso assoluto.
Author
Grazie Stesil, tutto OK.