CSS 'active' не работает при конвертации HTML в PHP include - PullRequest
Новая
       37

CSS 'active' не работает при конвертации HTML в PHP include

2 голосов
/ 17 июня 2010

Я понимаю, что был задан «похожий» вопрос, но другой пользователь использует совершенно другой подход, чем я.Я просто пытаюсь включить HTML-навигацию на своих страницах PHP для более легкой модификации в будущем.Когда вы наводите курсор на кнопку, она подсвечивается, а всегда активная страница «активная».Наведение работает как на страницах html, так и на php.

Когда моя страница индекса закодирована как index.html, работает «активное» состояние.Когда я запускаю его как index.php, это не так.

Header.html 

  <div class="header_resize">
    <div class="header">
      <div class="logo"><a href="index"><img src="images/logo.gif" width="234" height="118" border="0" alt="logo" /></a></div>
      <div class="menu">
        <ul>
          <li><a href="index.php"><span>Home Page </span></a></li>         
          <li><a href="portfolio.php"><span>Services</span></a></li>
          <li><a href="portfolio.php"><span>Portfolio</span></a></li>          
          <li><a href="about.php"><span> About Us </span></a></li>
          <li><a href="contact.php" class="active"><span> Contact Us</span></a></li>
        </ul>
      </div>
      <div class="clr"></div>
    </div>
  </div>

CSS: 

/*menu*/
.menu { padding:38px 0 0 0; margin:0; width:480px; float:right; }
.menu ul { text-align: left; padding:0; margin:0; list-style:none; border:0; float:right; }
.menu ul li { float:left; margin:0; padding:0 5px; border:0; }
.menu ul li a { float:left; margin:0; padding:12px 0; color:#fff; font:normal 12px Arial, Helvetica, sans-serif; text-decoration:none; }
.menu ul li a span { padding:12px 9px; background:none; }
.menu ul li a:hover { background: url(../images/r_menu.gif) no-repeat right; }
.menu ul li a:hover span { background:url(../images/l_menu.gif) no-repeat left; }
.menu ul li a.active { background:url(../images/r_menu.gif) no-repeat right; }
.menu ul li a.active span { background:url(../images/l_menu.gif) no-repeat left; }

Как я уже упоминал выше, если ссылкаВыше в header.html кодируются как (page.html), работает «активное наведение».Что дает?

РАЗРЕШЕНИЕ

Для тех, кто заинтересован, благодаря помощи Киркби я воссоздал файл Header.html, сохранил его как PHP и использовал функцию Request_URI.Изменения выглядят так: 

  <div class="header_resize">
    <div class="header">
      <div class="logo"><a href="index"><img src="images/logo.gif" width="234" height="118" border="0" alt="logo" /></a></div>
      <div class="menu">
        <ul>
          <li><a href="index" <?php if($_SERVER["REQUEST_URI"] == "/index") { echo 'class="active"';} ?>><span>Home Page </span></a></li>
          <li><a href="about" <?php if($_SERVER["REQUEST_URI"] == "/about") { echo 'class="active"';} ?>><span> About Us </span></a></li>          
          <li><a href="portfolio" <?php if($_SERVER["REQUEST_URI"] == "/portfolio") { echo 'class="active"';} ?>><span>Services</span></a></li>
          <li><a href="enroll" <?php if($_SERVER["REQUEST_URI"] == "/enroll") { echo 'class="active"';} ?>><span>Enroll</span></a></li>
          <li><a href="contact" <?php if($_SERVER["REQUEST_URI"] == "/contact") { echo 'class="active"';} ?>><span> Contact Us</span></a></li>
        </ul>
      </div>
      <div class="clr"></div>
    </div>
  </div>

Ответы [ 2 ]

1 голос
/ 12 октября 2011

Вот мое решение;это очень просто: 

<ul id="menu">
    <?php 
    $c=$_GET[c];
    ?>
    <li><a href="index.php?c=inicio.html" <?php if($c=="inicio.html"){ echo 'class="active"';}?>>Inicio</a></li>
    <li><a href="index.php?c=corporativo.html" <?php if($c=="corporativo.html"){ echo 'class="active"';}?>>Corporativo</a> </li>
    <li><a href="index.php?c=diseno.html" <?php if($c=="diseno.html"){ echo 'class="active"';}?>>Diseño</a></li>
    <li><a href="index.php?c=impresion.html" <?php if($c=="impresion.html"){ echo 'class="active"';}?>>Impresión</a> </li>
</ul>

Я читаю только переменную, которую я использовал в include.

1 голос
/ 17 июня 2010

Как добавить class="active" к правильной кнопке, когда вы включаете HTML-файл на страницу PHP? Из вашего примера, похоже, что файл заголовка HTML, который вы включаете, имеет активную кнопку «Связаться с нами», и так будет на всех страницах.

Чтобы добавить class="active" к нужной кнопке, вам потребуется либо код PHP в заголовке, либо использовать JavaScript в браузере, чтобы добавить класс к нужной кнопке для каждой страницы. Когда я пишу заголовок во включаемом файле, я обычно создаю функцию с параметром для выбора текущей вкладки в разделе навигации. Затем я вызываю эту функцию из соответствующего места на главной странице.

...