当我有包含(PHP)时,引导程序侧导航栏不起作用

时间:2017-09-25 04:57:06

标签: php jquery html css

我的代码在html文件中工作正常,页眉和页脚代码在产品页面中。问题是如果我在php文件中创建它,侧导航栏将无法工作,我已经尝试在产品页面中移动body标签,但它仍然无法正常工作。感谢任何帮助:)

标题-ee.php

<html>
<head>
    <?php
        include('parameters.php');
    ?>
    <title> <?php echo $page_title; ?> </title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="<?= $server_addr ?>/common/css/bootstrap.css">
    <script src="<?= $server_addr ?>/common/js/jquery-3.2.1.js"></script>
    <script src="<?= $server_addr ?>/common/js/bootstrap.js"></script>
    <script src="js/ee-home.js"></script>
    <link rel="stylesheet" href="css/ee-home.css">
</head>
<body data-spy="scroll" data-target="#myScrollspy" data-offset="20">
    <!--Start header-->
    <nav class="navbar navbar-default navigation-bar">
        <div class="container-fluid">
            <div class="row">
                <div class="navbar-header col-xs-12 col-sm-12 col-md-12 col-lg-6 centered-a">
                    <div class="row">
                        <div class="col-sm-3 centered-a">
                            <img src="img/ee-logo.png">
                        </div>
                        <div class="col-sm-9">
                            <h1 id="nav-brand">
                                EQUIPMENT ENGINEERS, INC.</br>
                            </h1>   
                            <h1 id="nav-brand-subtitle">
                                <small>
                                    Your Reliable Solutions Partner
                                </small>
                            </h1>
                        </div>
                    </div>
                    <a href="#">
                        <span class="link-spanner"></span>
                    </a>
                </div>
                <div class="navbar-header col-lg-6 visible-lg centered-a">
                    <div class="row centered-a" id="nav-box">
                        <div class="col-lg-2 centered-a">
                            <a href="#">
                                <p>Home</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                        <div class="col-lg-2 centered-a">
                            <a href="#">
                                <p>Our Company</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                        <div class="col-lg-2 centered-a">
                            <a href="#">
                                <p>SCM</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                        <div class="col-lg-2 centered-a">
                            <a href="#">
                                <p>Products</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                        <div class="col-lg-2 centered-a">
                            <a href="#">
                                <p>Inquiries</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                        <div class="col-lg-2 centered-a" id="last-item">
                            <a href="#">
                                <p">Supplier Accreditation</p>
                                <span class="link-spanner"></span>
                            <a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel-group col-md-12 centered-a hidden-lg">
                <div class="panel panel-default">
                    <div class="panel-heading" >
                        <h2 class="panel-title centered-a">
                            <span class="glyphicon glyphicon-triangle-bottom"></span>
                            <a data-toggle="collapse" href="#collapse1">
                                <span class="link-spanner"></span>
                            <a>
                        </h2>
                    </div>
                    <div id="collapse1" class="panel-collapse collapse">
                        <ul class="list-group">
                            <li class="list-group-item">
                                Home
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                            <li class="list-group-item">
                                Our Company
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                            <li class="list-group-item">
                                SCM
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                            <li class="list-group-item">
                                Products
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                            <li class="list-group-item">
                                Inquiries
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                            <li class="list-group-item">
                                Supplier Accreditation
                                <a href="#"><span class="link-spanner"></span></a>
                            </li>
                        </ul>
                    </div>
                </div> 
            </div>
        </div>
    </nav>
    <!--End header-->

products.php

<?php include("includes/header-ee.php"); ?>
<link rel="stylesheet" href="products.css"></link>
<div class="container-fluid">
    <div class="row">
        <!--Sidebar-->
        <nav class="col-md-3" id="myScrollspy">
            <span>Product Lineup</span>
            <ul class="nav nav-pills nav-stacked">
                <li class="active"><a href="#section1">Section 1</a></li>
                <li><a href="#section2">Section 2</a></li>
                <li><a href="#section3">Section 3</a></li>
            </ul>
        </nav>
        <!--Content-->
        <div class="col-md-9">
            <div id="section1">   
                <div class="bg-franklin bg-img centered-a">
                    <div class="caption" style="border:10px; border-color:white;">
                        <img src="img/products/franklin.png" style="width:50%; background-color:white;"></img>
                    </div>
                </div>
                <p style="margin-left:10px; margin-right:10px; font-size: 1.2em; text-align:left;padding: 0% 3%;">
                    </br>

                    </br></br>

                    </br></br>


                </p>
            </div>

            <div id="section2">   
                <div class="bg-franklin bg-img centered-a">
                    <div class="caption" style="border:10px; border-color:white;">
                        <img src="img/products/franklin.png" style="width:50%; background-color:white;"></img>
                    </div>
                </div>
                <p style="margin-left:10px; margin-right:10px; font-size: 1.2em; text-align:left;padding: 0% 3%;">
                    </br>

                    </br></br>

                    </br></br>

                </p>
            </div>
        </div>
    </div>
</div>
<?php include("includes/footer-ee.php"); ?>

页脚-ee.php

</body>

<footer>
    <div class="footer-blk row">
        <div style="float: none;text-align: center;">
            Home | Terms and Conditions | Privacy Policy 
        </div>
        <div style="float: none;text-align: center;">

        </div>
    </div>
</footer>

0 个答案:

没有答案