Foundation 6 Wordpress Theme

Question

Ich versuche, der mobilen Navigation etwas Animation hinzuzufügen, um langsam herunterzulassen, anstatt die Seite springen zu lassen. Ich benutze das Fundamentpresse-Thema. Ich kann nicht scheinen, es mit Daten-animieren zu lassen. Das ist mein Code-Schnipsel:

<div class="title-bar" data-responsive-toggle="site-navigation"> 
     <button class="menu-icon" data-toggle="panel" type="button" data-toggle="mobile-menu"></button> 
     <div class="title-bar-title"> 

      <div class="mini-logo"> 
      <a href="<?php echo esc_url(home_url('/')); ?>" rel="home"><img class="mini-logo-img" src="/wp-content/uploads/2016/11/coc-logo.png" alt="Mountain View" style="width:4rem;height:auto;"></a> 
      </div> 
      <!--<a href="<?php echo esc_url(home_url('/')); ?>" rel="home"><?php bloginfo('name'); ?></a>--> 
     </div> 
    </div> 

<!--<nav id="site-navigation" class="main-navigation nav-area" role="navigation" style="width:100%" >--> 
     <div class="top-bar-left"> 
      <ul class="menu"> 
       <li class="co-logo-top"></li> 
       <!--<li class="home"><a href="<?php echo esc_url(home_url('/')); ?>" rel="home"><?php bloginfo('name'); ?></a></li>--> 
      </ul> 
     </div> 
     <div class="top-bar-right" > 
      <?php foundationpress_top_bar_r(); ?> 

      <?php if (! get_theme_mod('wpt_mobile_menu_layout') || get_theme_mod('wpt_mobile_menu_layout') === 'topbar') : ?> 
       <?php get_template_part('template-parts/mobile-top-bar'); ?> 
      <?php endif; ?> 
     </div> 
    </nav> 

Answer 1

haben Sie versucht, es mit jquery/js Auslösung? diesen Thread sehen: https://github.com/olefredrik/FoundationPress/issues/772.

auch überprüfen, ob Sie das data-toggler Attribut zu dem Elemente hinzugefügt haben

Answer 2

Ich bin nicht die tatsächliche ‚# mobile-Menü‘ Komponente in Ihrer Code-Snippet zu sehen, also nicht 100% sicher, was hier passiert, aber die Was Sie beachten sollten, ist, dass Sie das Data-Animate-Attribut auf demselben Element haben müssen wie Ihr Data-Toggler-Attribut (in diesem Fall ist das Ding, das umgeschaltet wird, oder "# Mobile-Menu"). Siehe das Beispiel hier: http://foundation.zurb.com/sites/docs/toggler.html#toggle-with-animation