Autore Topic: Barra menu(oppure sidebar) fissa con protostar e jQuery  (Letto 6336 volte)

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
In questa guida cerchero' di spiegare come rendere fisso un menu o una sidebar tramite javascript.
Link all'articolo:  http://www.joomla.it/e-ancora/articoli-community-3x/7666-barra-menu-oppure-sidebar-fissa-con-protostar-e-jquery.html
« Ultima modifica: 29 Gen 2015, 17:45:02 da alexred »
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #1 il: 12 Feb 2015, 10:40:08 »
Ottimo articolo, mi funziona solo con il menu di dx. mentre  il top menu di Protostar non va anche assegnando uno sfondo al menu quindi nel file template.css aggiungete .stick_menu{background-color:white;z-index:10000}

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #2 il: 12 Feb 2015, 10:45:51 »
Mettimi un link del sito dove hai problemi ;)
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #3 il: 12 Feb 2015, 11:18:54 »
Le modifiche le avevo fatto in locale , ora le ho caricate su un sito online ma non cambia nulla:
http://www.xxxxxxxxxx.it/
« Ultima modifica: 22 Feb 2015, 20:54:05 da ciroslitz »

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #4 il: 12 Feb 2015, 11:29:25 »
Nell'index.php del template (template/protostar/index.php)
dovresti modificare questa riga da cosi:
Codice: [Seleziona]
<nav class="navigation" role="navigation">a cosi
Codice: [Seleziona]
<nav class="navigation" role="navigation" id="navigation">
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #5 il: 12 Feb 2015, 11:49:19 »
Perfetto, ora funziona solo che il menu finisce dietro degli elementi la slide in home, pulsanti social, banner e video negli articoli. Devo dargli colore perch trasparente
« Ultima modifica: 12 Feb 2015, 12:03:24 da ciroslitz »

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #6 il: 12 Feb 2015, 12:02:42 »
Preciso che durante lo scroll le voci del top menu non sono cliccabili perch dietro degli elementi.
ho dato colore ma non lo prende
 .stick_menu{background-color:grey;z-index:10000}
« Ultima modifica: 12 Feb 2015, 12:07:05 da ciroslitz »

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #7 il: 12 Feb 2015, 12:05:07 »
Devi aggiungere in fondo nel file templates/protostar/css/template.css la riga da te sopra citata ovvero
Codice: [Seleziona]
.stick_menu{background-color:white;z-index:10000}
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #8 il: 12 Feb 2015, 12:08:21 »
Devi aggiungere in fondo nel file templates/protostar/css/template.css la riga da te sopra citata ovvero
Codice: [Seleziona]
.stick_menu{background-color:white;z-index:10000}


la riga stata aggiunta nel personal css, ma il menu finisce spesso dietro
« Ultima modifica: 12 Feb 2015, 12:10:05 da ciroslitz »

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #9 il: 12 Feb 2015, 12:15:51 »
Il problema che hai un errore nel personal.css.
Subito prima della riga aggiunta manca una graffa chiusa (quella della media query)
Per intenderci ti riporto il pezzo errato
Codice: [Seleziona]
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr {
        display: block;
    }
  .stick_menu{background-color:white;z-index:10000}
Andrebbe modificato cosi' (aggiungendo una graffa chiusa)
Codice: [Seleziona]
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr {
        display: block;
    }
}
  .stick_menu{background-color:white;z-index:10000}
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #10 il: 12 Feb 2015, 14:08:21 »
Ok, perfetto. Ora devo solo sistemare i due menu al meglio. :D

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #11 il: 13 Feb 2015, 09:37:26 »
Scusa ultima cosa quale parametro andrebbe settato per la sidebar laterale per evitare che si sposti troppo verso sx cio verso i contenuti?

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #12 il: 13 Feb 2015, 10:23:07 »
Prova ad aggiungere nei css
Codice: [Seleziona]
.stick_sidebar{margin-left:20px !important}
« Ultima modifica: 13 Feb 2015, 10:25:11 da davidepc »
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #13 il: 13 Feb 2015, 11:41:53 »
Prova ad aggiungere nei css
Codice: [Seleziona]
.stick_sidebar{margin-left:20px !important}


Perfetto tutte modifiche ottime. Grazie  ;D

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #14 il: 20 Feb 2015, 16:23:02 »
Mi dispiace.... ma sono di ritorno non mi quadra una cosa assurda,  quando mi loggo in home e solo nella prima pagina accade, dopo essermi loggato il menu si sposta verso sx tutto la pagina diventa in grassetto e il menu non resta fisso, mentre nella secondae altre pagine della home tutto funziona regolarmente anche da loggato.


PS Ulteriore precisazione avviene solo se l'utente ha i privilegi di editor quindi quando nel menu utente compare la voce invia  articolo
« Ultima modifica: 20 Feb 2015, 16:33:36 da ciroslitz »

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #15 il: 22 Feb 2015, 17:03:17 »
Per non creare dubbi sul lavoro di davide pc che perfetto con le modifiche consigliate.... per gli altri utenti preciso che facendo prove in locale, ho eliminato la modifica menu, ho cambiato anche templeate, ma quando mi loggo con profilo edito o admin sulla home page e solo sulla prima pagina diventa grassetto la sider di dx. quindi nulla di imputabile alle tue modifiche. Resta da capire solo cosa genera questo...... non neppure il templeate, sto procedendo ora con le  estensioni.

Assurdo tutto dipendeva da un articolo che influiva.... non capisco come ma almeno ne sono venuto a capo
« Ultima modifica: 22 Feb 2015, 20:55:35 da ciroslitz »

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #16 il: 23 Feb 2015, 17:11:49 »
Ciao probabilmente nell'articolo c'era qualche tag aperto e non chiuso (per tag intendo tipo i "div" i tag "b" del grassetto,etc...).
Davide Granata
Web developer PHP
www.davidepc.com

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #17 il: 24 Feb 2015, 16:41:03 »
Mi stato segnalato che il menu non resta fisso su iOS (iPad). Ed alcuni invece con opera e chrome (preciso di non sapere la risoluzione e versione) il men di dx si sposta a sx e ci resta coprendo articoli ( ho invitato ha pulire cache), in quanto dal mio opera e chrome non danno problemi per iPad non ho testato.

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #18 il: 25 Feb 2015, 09:10:33 »
Considera che se la risoluzione dello schermo e' inferiore a 768px il menu fisso non si attiva come puoi facilmente vedere dal codice che ho scritto nella guida.
Davide Granata
Web developer PHP
www.davidepc.com

Offline valpredina

  • Esploratore
  • **
  • Post: 68
  • Sesso: Maschio
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #19 il: 24 Apr 2015, 15:47:49 »
Ciao a tutti,
sto cercando di utilizzare questo script jquery per rendere fisso il menu orizzontale di un sito in via di sviluppo.
La cosa strana che su Firefox funziona come ci si aspetterebbe, mentre su chrome funziona ma solo dopo che la pagina stata scrollata di un certo valore (fino allo scroll completo dello slideshow che risiede in posizione banner). In firefox il menu quindi sempre visibile mentra in chrome prima sparisce e poi misteriosamente riappare al top della pagina ....
Grazie in anticipo per l'aiuto
ah il sito per chi volesse rendersi conto del comportamento anomalo http://www.arscapsa.joomlafree.it (in fase di sviluppo).


Come non detto, il menu era in posizione ma spariva dietro lo slider risolto con istruzione (ed era gi scritto)  :'(
.stick_menu{background-color:grey;z-index:10000}
« Ultima modifica: 24 Apr 2015, 16:06:37 da valpredina »

Offline davidepc

  • Esploratore
  • **
  • Post: 144
    • Mostra profilo
    • Davidepc-Programmatore PHP freelance
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #20 il: 24 Apr 2015, 15:56:50 »
Ciao dovrebbe bastare che aggiungi ai css
Codice: [Seleziona]
.stick_menu{  z-index: 9999 !important;}
Davide Granata
Web developer PHP
www.davidepc.com

Offline valpredina

  • Esploratore
  • **
  • Post: 68
  • Sesso: Maschio
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #21 il: 24 Apr 2015, 17:25:21 »
Si infatti era proprio quello
Grazie

Offline martone

  • Esploratore
  • **
  • Post: 182
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #22 il: 03 Mar 2016, 20:21:49 »
Ciao, bella guida e molto utile.
A me funziona tutto bene, solo vorrei che il modulo cerca nella position-0 si blocchi e compaia come i pulsanti Twitte e follow nel sito di riferimento. ho provato, ma non ci sono riuscito.
Grazie Massimo

Offline martone

  • Esploratore
  • **
  • Post: 182
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #23 il: 07 Ott 2016, 10:39:46 »
ciao a tutti, ho aggiornato a joomla 3.6.2 e non mi funziona pi, cambiato qualcosa?


Grazie

Offline ciroslitz

  • Esploratore
  • **
  • Post: 134
    • Mostra profilo
Re:Barra menu(oppure sidebar) fissa con protostar e jQuery
« Risposta #24 il: 27 Gen 2017, 08:32:05 »
Ho notato che da ieri su chrome genera problemi la pagina scorre verso il basso... ho dovuto disattivarlo

 

Torna su