[Javascript] problema menu responsive su aruba, editor bk

Discussione in 'Javascript' iniziata da PavlovTheDog, 14 Aprile 2018.

  1. PavlovTheDog

    PavlovTheDog Nuovo Utente

    Registrato:
    14 Aprile 2018
    Messaggi:
    24
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Ciao a tutti.
    Ho un problema con il menu di navigazione responsive sul mio sito creato tramite aruba, e quindi l'editor BaseKit.
    Dovendo creare il sito in due lingue, ho dovuto inserire due menu di navigazione con nomi pagine e collegamenti alle pagine diversi, ma, sebbene abbia ricopiato il codice html del widget di navigazione incluso nel template, non mi funziona in modo responsive.

    Purtroppo è una situazione contrattuale in cui non posso ricevere supporto "sviluppatori" nè dal provider, nè dallo staff di BK...

    Ho un codice html di questo tipo:

    HTML:
                <div id="page-zones__template-widgets__extendednavigation-navigation" class="widget extendednavigation" data-widget-type="extendednavigation" data-uniqueid="page-zones__template-widgets__extendednavigation-navigation">
                   <div class="extendednavigation"  align="center">
                       <ul class="js-menu-list  14-items">
                           <li id="menu-item_1" class="home"><a href="/"><span class="text">pagina iniziale</span></a></li>
                           <li "menu-item_2" class="page  folder" aria-haspopup="true"><a href="/galleria"><span class="text">galleria</span></a>
                               <ul class="js-menu-list 2-items page">
                                   <li "menu-item_3" class="page"><a href="/acquerello"><span class="text">acquerello</span></a></li>
                                   <li "menu-item_4" class="page"><a href="/incisione"><span class="text">incisione</span></a></li>
                               </ul>
                               .....
                            </ul>
                           <a href="#" class="pull js-pull"></a>
                    </div>
                  </div>
    Dovrei fare in modo che l'elemento "a.pull", presente nella visualizzazione per tablet e smartpone, mostri e nasconda al click le voci del menù di navigazione.
    I CSS sono giusti e infatti il menu viene visualizzato "block" se aggiungo manualmente, tramite HTML la classe "open" all'elemento ul.
    Nell'editor c'è già preimpostato un codice javascript/jquery che evidentemente non riesce a svolgere questa funzione. Non so come venirne a capo. Ho già provato alcuni script, ma o non li so adattare, oppure semplicemente non so come inserirli.
    Sarei molto grato se qualcuno potesse aiutarmi.
    Grazie in anticipo a tutti.
     
    Ultima modifica: 17 Aprile 2018
  2. PavlovTheDog

    PavlovTheDog Nuovo Utente

    Registrato:
    14 Aprile 2018
    Messaggi:
    24
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Non so se qualcuno abbia mai avuto interesse in questo thread, ma, per la cronaca, ho risolto così:

    HTML:
    <div id="page-zones__template-widgets__extendednavigation-navigation" class="widget extendednavigation" data-widget-type="extendednavigation" data-uniqueid="page-zones__template-widgets__extendednavigation-navigation">
      <div class="extendednavigation"  align="center">
        <ul id="menunav" class="js-menu-list 13-items">
           <li id="menu-item_1" class="home  page"><a href="/"><span class="text">pagina iniziale</span></a></li>
           <li id="menu-item_2" class="page  folder" aria-haspopup="true"><a href="/galleria"><span class="text">galleria</span></a>
             <ul class="js-menu-list 2-items page">
               <li id="menu-item_3" class="page"><a href="/acquerello"><span class="text">acquerello</span></a></li>
               <li id="menu-item_4" class="page"><a href="/incisione"><span class="text">incisione</span></a></li>
              </ul>
           </ul>
             <a onclick="showNav()" href="#" class="pull  js-pull"></a>
    </div>
    </div>
    
    <script>
    function showNav() {
        var element = document.getElementById("menunav");
    
        if (element.classList) {
            element.classList.toggle("open");
        } else {
            var classes = element.className.split(" ");
            var x = classes.indexOf("open");
    
            if (x >= 0)
                classes.splice(x, 1);
            else
                classes.push("open");
                element.className = classes.join(" ");
        }
    }
    </script>
    Bye.
     
Sto caricando...

Condividi questa Pagina