【问题标题】:Bootstrap Nav not toggling; .php files in seperate folders引导导航不切换; .php 文件在不同的文件夹中
【发布时间】:2014-12-21 20:20:06
【问题描述】:

我正在使用引导程序创建一个响应式网站,当屏幕尺寸较小时,我的导航栏切换按钮出现问题...

当我所有的 .php 文件都在同一个目录(根目录)中时,该按钮工作正常;但是我只是更改了它,以便所有 .php 文件现在都在它们各自的文件夹中,(contact.php 现在是contact/index.php 等)以创建更清晰的 url。这导致切换按钮在单击时不再切换。

我的导航代码如下;任何见解将不胜感激,谢谢!

<!-- NAVIGATION -->
  <div class="navbar navbar-default" role="navigation">
    <div class="navbar-inner">
      <div class="container inner-container">
        <div class="navbar-header">
          <a href="index.php" class="navbar-brand"><img src="../img/index/skytek-logo/Skytek_c1_S.png" width="160px" height="90px" alt="Skytek Logo"></a><p class="navbar-slogan">Dedicated to excellence in innovation and service</p>
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#nav-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
          <div class="collapse navbar-collapse" id="nav-collapse">
              <ul class="nav navbar-nav">
                 <?php
                  /* list items with a class of "active" indicate the current section;
                   * the $section variable is set in each individual file
                   */
                 ?>
                 <li class="home <?php if ($section == "home") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>">Home</a></li>
                 <li class="about <?php if ($section == "about") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>about/">About Us</a></li>
                 <li class="support <?php if ($section == "support") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>services/">Support &amp; Services</a></li>
                 <li class="sales <?php if ($section == "sales") { echo "active"; } ?>"><a href="#" style="color: #AAA;">Sales</a></li>
                 <li class="news <?php if ($section == "news") { echo "active"; } ?>"><a href="#" style="color: #AAA;">News</a></li>
                 <li class="contact <?php if ($section == "contact") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>contact/">Contact</a></li>
                 <li class="careers <?php if ($section == "careers") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>careers/">Careers</a></li>
                 <li class="staff <?php if ($section == "staff") { echo "active"; } ?>"><a href="<?php echo BASE_URL; ?>staff/">Staff Zone</a></li>
              </ul>  
          </div>
        </div>
      </div>
    </div>
<!-- END NAVIGATION -->

【问题讨论】:

  • 由于 Bootstraps 导航栏折叠行为取决于 jQuery 和 Bootstraps javascript 使用例如 Chrome 中的 DevTools 来查看它们是否正确加载。也许将 php 文件移动到另一个目录会破坏对这些文件的引用。

标签: php css twitter-bootstrap responsive-design


【解决方案1】:

谢谢你ckuijjer;我将 js 文件的路径从 'js/bootstrap.min.js' 更改为 '../js/bootstrap.min.js' 并且切换按钮现在可以正常工作了..

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-05-21
    • 2016-07-20
    相关资源
    最近更新 更多