WebSite X5Help Center

 
Agostino M.
Agostino M.
User

Scroll menu responsive  it

Autor: Agostino M.
Visited 2365, Followers 2, Udostępniony 0  

in responsive il menù non fa lo scroll

sito http://agostinomacchione.it

questi i codici inseriti al passo "4" sezione "statistiche-seo-codice" sezione "esperto"

prima della chiusa del tag head:

<style>
#imMnMn > ul > li.imMnMnSeparator {
background-image: none;
!padding-bottom: 0px;
height:auto;
font: 12px Tahoma, bold,;
!text-align:center;
}
#imMnMn > ul > li.imMnMnSeparator .imMnMnFirstBg .imMnMnTxt {
display: block;
color:blue;
}
#imMnMn > ul > li.imMnMnSeparator .imMnMnFirstBg .imMnMnTxt:hover {
color:blue;
}
</style>

<style>
#imHeader .search_form {
display:block;
}
</style>

<style>
#imHeader .imTemplateContent {
display:block;
}
!</style>

Proprietà del tab Body:

<!-- Begin Cookie Consent plugin by Silktide - http://silktide.com/cookieconsent -->
<script type="text/javascript">
window.cookieconsent_options = {"message":"Su questo sito utilizziamo cookie tecnici e, previo tuo consenso, cookie di profilazione, nostri e di terze parti, per proporti pubblicità in linea con le tue preferenze. Cliccando in un punto qualsiasi dello schermo, effettuando un’azione di scroll o chiudendo questo banner, invece, presti il consenso all’uso di tutti i cookie. Se vuoi saperne di più clicca su","dismiss":"Accetta","learnMore":"altre informazioni.","link":"http://agostinomacchione.it/cookie-policy.html","theme":"dark-top"};
</script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.9/cookieconsent.min.js"></script>
<!-- End Cookie Consent plugin -->

<style>
#imMnMn .hamburger-bar {
background-color:white;
padding-bottom: 0px;
}
#imMnMn .hamburger-button {
right:30px;
}
</style>

<style>
@media screen and (max-width: 1279px) {
.hamburger-button::after {
content:"MENU";
color:white;
margin-left: -5px;
}
#imMnMn .hamburger-bar {
height: 5px;
margin: 5px auto;
width: 125%;
}
}
</style>

dove sbaglio ?

Posted on the
19 ODPOWIEDZI - 4 USEFUL
 lemonsong  
 lemonsong  
User

Premesso che anche altri lamentano questo problema, i CSS (tag style) vanno inseriti tutti in head, non nel body.

Ad ogni modo, prova con questa toppa temporanea:

<style>
#imMnMn > ul {
    overflow:auto;
    height:100%;
}
</style>

Tengo a precisare che NON ho provato a creare un nuovo progetto con menu verticale per testarlo con dispositivi mobili, ho solo dato un'occhiata al sito in questione, quindi non so se la "toppa" può essere sostituita con impostazioni da programma.

Czytaj więcej
Posted on the from  lemonsong  
Agostino M.
Agostino M.
User
Autor
 lemonsong  
Premesso che anche altri lamentano questo problema, i CSS (tag style) vanno inseriti tutti in head, non nel body. Ad ogni modo, prova con questa toppa temporanea: <style> #imMnMn > ul {     overflow:auto;     height:100%; } </style> Tengo a precisare che NON ho provato a creare un nuovo progetto con menu verticale per testarlo con dispositivi mobili, ho solo dato un'occhiata al sito in questione, quindi non so se la "toppa" può essere sostituita con impostazioni da programma.

grazie Lemon

prima di tutto ho portato i css tag style in head e ho abbassato il tutto a 960px cambiando quindi il valore @media screen and (max-width: 1279px) in 959px perchè altrimenti anche in formato desktop entrava quasi subito in modalità responsive.

ho inserito come da te suggerito

<style>
#imMnMn > ul {
    overflow:auto;
    height:100%;
}
</style>

ma noto che l'ultima riga del menù non viene mai visualizzata con nessun browser in responsive e lo stesso menù si comporta in modo anomalo a seconda dei browser utilizzati nei cellulari.

Ho anche provato a cancellare tutto quanto riportato in head alla voce esperto pensando che magari fosse un problema di css ma il problema resta... l'ultima voce nel menù responsive fa i capricci :)

attendo tue possibili soluzioni grazie

Czytaj więcej
Posted on the from Agostino M.
Agostino M.
Agostino M.
User
Autor

ho provato ad usare un "trucchetto" mettendo una pagina vuota e senza nome.

su responsive va bene perchè così viene visualizzata la penultima voce menù ma su desktop mi ritrovo uno spazio che non si vede ma se ci si clicca sopra ovviamente si entra in una pagina vuota.

ho provato a mettere il separatore vuoto ma questo non crea uno spazio sul menù responsive.

resto in attesa di consigli ;)

Czytaj więcej
Posted on the from Agostino M.
Agostino M.
Agostino M.
User
Autor

Lemon con la funzione 

heightcalc(100% - 40px);

lo scroll funziona e l'ultima voce adesso si vede :)

se riesci a dirmi come risolvere il fatto che con lo scroll del menù scrolla anche il sito, che dovrebbe rimanere fermo, mi hai salvato da bestemmie inimmaginabili eheheheh

Czytaj więcej
Posted on the from Agostino M.
 lemonsong  
 lemonsong  
User

Credo che debba essere fatta una segnalazione ufficiale e precisa sui problemi del menu in modalità responsive.

Intanto dovresti togliere questa riga perché, oltre che superflua è anche sbagliata: !height:100%;

Anche il codice CookieConsent è da spostare da dove è ora.

L'hai inserito in Proprietà del tag BODY ma va inserito Dopo l'apertura del tag BODY o Prima della chiusura del tag BODY

Czytaj więcej
Posted on the from  lemonsong  
Agostino M.
Agostino M.
User
Autor

ok grazie perfetto...

scusa la mia ignoranza in materia ma differenze tra

Dopo l'apertura del tag BODY Prima della chiusura del tag BODY ???

Czytaj więcej
Posted on the from Agostino M.
 lemonsong  
 lemonsong  
User

Se inserisci degli elementi con position static (default) si posizioneranno prima (Dopo l'apertura del tag BODY) o dopo (Prima della chiusura del tag BODY) gli altri elementi del body.

Nel tuo caso è indifferente.

Czytaj więcej
Posted on the from  lemonsong  
5t3llino ..
5t3llino ..
User

agostino, come è possibile inserire il tasto nella barra dei cookie? potresti indicarmelo?

grazie.

Czytaj więcej
Posted on the from 5t3llino ..
 lemonsong  
 lemonsong  
User
Mirko Boschetti
provato il codice postato di Lemonsong su menu orizzontale, con responsive tutto ok, ma poi mi elimina il menu desktop...

Con il menu orizzontale ma anche con quello verticale è consigliabile inserire i CSS di correzione in una media query.

Czytaj więcej
Posted on the from  lemonsong  
Mirko Boschetti
Mirko Boschetti
Moderator
 lemonsong  
Con il menu orizzontale ma anche con quello verticale è consigliabile inserire i CSS di correzione in una media query.

OK...Tanks...

Czytaj więcej
Posted on the from Mirko Boschetti
Mirko Boschetti
Mirko Boschetti
Moderator

@Lemonsong

Provato e funzia perfettamente....grazie 1000000

Czytaj więcej
Posted on the from Mirko Boschetti
Agostino M.
Agostino M.
User
Autor
Stellino S.
agostino, come è possibile inserire il tasto nella barra dei cookie? potresti indicarmelo? grazie.

io ho messo questo al passo 4, statistiche seo, esperto, prima della chiusura del tag body:


<script type="text/javascript">
window.cookieconsent_options = {"message":"qui metti il tuo messaggio","dismiss":"OK","learnMore":"privacy cookie","link":"qui metti l'indirizzo della tua pagina politica cookie","theme":"dark-top"};
</script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.9/cookieconsent.min.js"></script>

Czytaj więcej
Posted on the from Agostino M.
Agostino M.
Agostino M.
User
Autor
 lemonsong  
Mirko Boschetti provato il codice postato di Lemonsong su menu orizzontale, con responsive tutto ok, ma poi mi elimina il menu desktop... Con il menu orizzontale ma anche con quello verticale è consigliabile inserire i CSS di correzione in una media query.

Lemon, cioè ? come devo inserire i css in una media query ? te lo chiedo perchè cambiando il menù da verticale ad orizzontale lo stesso menù scompare come detto sopra.

grazie

Czytaj więcej
Posted on the from Agostino M.
 lemonsong  
 lemonsong  
User
Agostino M.
come devo inserire i css in una media query ?

L'hai anche riportato nel tuo primo post.

Comunque, devi spostare questa regola:

#imMnMn > ul {
    overflow:auto;
    height: calc(100% - 40px);

}

... all'interno di questo codice (media query), dove hai altre regole:

@media screen and (max-width: 959px) {

}

Czytaj więcej
Posted on the from  lemonsong  
Agostino M.
Agostino M.
User
Autor

grazie ;)

Czytaj więcej
Posted on the from Agostino M.
5t3llino ..
5t3llino ..
User

agostino?

Czytaj więcej
Posted on the from 5t3llino ..
Agostino M.
Agostino M.
User
Autor
Stellino S.
agostino?

dimmi

Czytaj więcej
Posted on the from Agostino M.