Menu che si blocca

[james81]

Ciao a tutti!
volevo chiedervi un conisglio per quanto riguarda un'effetto:
girando ho trovato dei siti che hanno un menu posizionato circa a 3/4 e poi scorrendo lapagina verso il basso si sposta verso l'alto e si blocca all'inizio della pagina e rimane li fino a che non ritorni nella parte lata della pagina e riprende la sua posizione.

qualcuno sà come si realizza ?
Grazie

[deleted_129]

Se posti un esempio ti possiamo aiutare

[pascalman]

Stile menu del sito della Juventus?

[deleted_129]

In quel caso è semplice perchè basta inserirlo così:

#menu{
position:fixed;
top:0;
}

[james81]

Esatto , proprio come quello della Juventus, ma il mio inizialmente è posizionato un po' più in basso, ma il principio è più o meno quello

[james81]

Esatto , proprio come quello della Juventus, ma il mio inizialmente è posizionato un po' più in basso, ma il principio è più o meno quello

[deleted_129]

Per fare un effetto simile credo che potresti usare il javascript, non credo che con il CSS puoi fare una cosa simile, puoi ancorarlo sempre al top ,ma non puoi farlo partire in una posizione e poi quando 'scrolli' metterlo in un'altra..almeno credo, posso anche sbagliarmi. Cmq ti conviene prendere una strada come quella del javascript...

[james81]

visto uin pò la complessità, pensavi di utilizzare quell'idea che dà la possibiltà tramite una "linguetta" posta sulla sinistra dello schermo di far scorrere una finestra da sinistra verso detra, generlamente l'ho vista utilizzata per i moduli contatti, qualche idea dove sù come realizzarla?

grazie

[mahamatt]

Credo che intenda una cosa tipo questa (provate a scrollare la pagina):

https://buy.guildwars2.com/en/

È fattibile con javascript, non è altro (se ricordo bene) che un cambio di classe che avviene quando lo scrolling della pagina supera un certo numero di px.

[deleted_129]

Carino l'effetto, anche in quel caso javascript potrebbe essere una strada. Teoricamente dovresti impostare che quando la scroolbar arriva ad un tot di pixel , il menu' diventa con top:0; position:fixed; ... potrei anche postarti un codice ma lascio il javascript a chi è più bravo di me.