Question

我有一个菜单，存储在header.php文件中。然后，使用php include函数将文件包含在内。

由于脚本位于头文件中，因此子菜单项不会在手机上显示。

我还试图显示3级菜单项，但到目前为止还没有运气。

<header class="header header_style_01">
    <nav class="megamenu navbar navbar-default">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/"><img src="/images/logos/logo-seo.png" alt="image"></a>
            </div>
            <div id="navbar" class="navbar-collapse collapse" onclick="void(0)">
        <ul class="nav navbar-nav navbar-right hidden-md hidden-sm hidden-xs">
                    <li><a class="btn-light btn-radius btn-brd top-btn" href="/contact"><i class="fa fa-angle-double-right"></i>GET IN TOUCH</a></li>
                </ul>
                <ul class="nav navbar-nav navbar-right menu-top">
                    <li class="menu-item"><a class="menubar" href="/">Home</a></li>


<li class="link">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle drop-services" type="button" data-toggle="dropdown" data-hover="dropdown">Services</button>
<ul class="dropdown-menu dropdown-menu-left">
    <li class="dropdown"><a class="subMenuList"  href="/services/link-1">Link 1</a>
  <ul class="dropdown-menu dropdown-menu-left" data-hover="dropdown" >
    <li><a href="/services/link-2">Sub link 1</a></li>
    <li><a href="/services/link-3">Sub link 2</a></li>
         <li><a href="/services/link-4">Sub link 3</a></li>
   </ul>
     </li>
        </ul>
    </div>
    </li>
    <li class="menu-item"><a class="menubar" href="/about">About Us </a></li>
                    <li class="menu-item"><a href="/careers">Careers</a></li>
                    <li class="menu-item"><a href="/news">News</a></li>
                </ul>
            </div>
        </div>
    </nav>
    </header>

<script>
function addClass(){    
var pageurl = window.location.href;             
var menubar = document.getElementsByClassName('menubar');

for(i=0;i<menubar.length;i++) { 
if(menubar[i].href.toLowerCase()==pageurl.toLowerCase())    {
  menubar[i].className +=' active';
    }
}
}

var result = addClass();
window.onload = result;



</script>

这是我的index.html页面，其中包含文件header.php

    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <!-- Site CSS -->
    <link rel="stylesheet" href="/style.css">
    <!-- Colors CSS -->
    <link rel="stylesheet" href="/css/colors.css">
    <!-- ALL VERSION CSS -->
    <link rel="stylesheet" href="/css/versions.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="/css/responsive.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="/css/custom.css">
    <!-- Bootstrap Dropdown Hover CSS -->
       <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
            <!-- Bootstrap Dropdown Hover JS -->
        <script src="/js/bootstrap-dropdownhover.min.js"></script>

<link href="/css/animate.min.css" rel="stylesheet">
<link href="/css/bootstrap-dropdownhover.min.css" rel="stylesheet">
</head>

<body class="seo_version">

    <!-- LOADER -->
    <div id="preloader">
        <div id="cupcake" class="box">
            <span class="letter">L</span>
            <div class="cupcakeCircle box">
                <div class="cupcakeInner box">
                    <div class="cupcakeCore box"></div>
                </div>
            </div>
            <span class="letter box">A</span>
            <span class="letter box">D</span>
            <span class="letter box">I</span>
            <span class="letter box">N</span>
            <span class="letter box">G</span>
        </div>
    </div>
    <!-- END LOADER -->

    <?php include($_SERVER['DOCUMENT_ROOT'].'/header.php') ?>

        <div id="home" class="parallax first-section" data-stellar-background-ratio="0.4" style="background-image:url('uploads/parallax_12.jpg');">
            <div class="container">
                <div class="row">

子菜单项未显示在手机上

0 个答案: