bootstrap折叠导航在我的wordpress主题手机中不起作用

bootstrap collapse navigation not working in my wordpress theme in mobile

本文关键字：手机 不起作用 wordpress 折叠 导航 我的 bootstrap      更新时间：2023-09-26

bootstrap折叠导航在移动设备中的wordpress主题中不起作用当我在mobile/iphone上使用它时，菜单隐藏在使用过的图像图标后面，但当我单击此图像时，它不会折叠，也不会显示所有列表项。

   <div class="container">
<div style="position: static;" class="navbar navbar-inverse">
          <div class="navbar-inner">
            <div class="container">
              <a data-target="navbar-inverse-collapse" data-toggle="collapse" class="btn btn-navbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </a>
              <a href="#" class="brand"><img src="<?php echo get_template_directory_uri();?>/images/spa_logo.png" alt="spasalon" /></a>
               <div class="nav-collapse collapse navbar-inverse-collapse">
                  <?php
          if ( has_nav_menu( 'header-menu' ) ):
          wp_nav_menu( array(  'menu'       => 'header-menu',
                       'theme_location' => 'header-menu',
                       'depth'      => 3,
                       'container'  => false,
                       'menu_class' => 'nav',
                       'menu_id'=>'a',
                       'show_home'=>'HOME',
                      'fallback_cb' => 'wp_page_menu', 
                        'walker' => new twitter_bootstrap_nav_walker()
                        )
                        );

      endif; ?> 

     </div><!-- /.nav-collapse -->
            </div>
          </div><!-- /navbar-inner -->
        </div>

我会尝试将bootstrap-collapse.js作为一个单独的文件添加到函数文件中的wp_register_script（）中。请确保您也正确添加了bootstrap.min.js。我也遇到了同样的问题，然后正确地将js文件放入队列，现在一切都很好。

我在为博客创建主题时找到了解决方案。

要添加的脚本。。。

<script src="js/bootstrap.min.js"></script>

  • 请转到主题文件夹中的functions.php文件，并在函数下面添加。

    function tsbs2013_scripts_with_jquery(){
    // Register the script like this for a theme:
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/bootstrap.min.js', array( 'jquery' ) );
    // For either a plugin or a theme, you can then enqueue the script:
    wp_enqueue_script( 'custom-script' );
}
add_action( 'wp_enqueue_scripts', 'tsbs2013_scripts_with_jquery' );
相关文章：