Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: XKC en 31 Octubre 2017, 16:35 pm



Título: Error bootstrap 3 en navbar
Publicado por: XKC en 31 Octubre 2017, 16:35 pm
Hola a todos y gracias de antemano,
Supongo que muchos habreis utilizado bootstrap para crear los estilos d euna web, y bien, yo tengo un problema:
Tengo en el directorio / :
  - index.php
  - about.php
  - Otros...

La cuestion es que en index.php tengo una barra de navegacion:
Código:
<nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
              <span class="icon-bar"></span>                     
            </button>
            <a class="navbar-brand" href="#ini">......</a>
          </div>
          <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav navbar-right">   
              <li><a href="#aboutUs">Sobre nosotros</a></li>
              .............................................
            </ul>
          </div>
        </div>
      </nav>

y en el mismo documento tengo codigo tal que:
Código:
  
<section id="aboutUs" class="container-fluid text-center"></section>

Todo funciona bien, incluso tengo animaciones y demas.

El problema viene cuando en la pagina about.php quiero mantener la misma barra de navegacion, con la diferencia de que quiero que rediriga a index.php, tal que si desde about.php pinchas en about us quiero que me redirija a index.php en la sección about us.
Entonces tengo este codigo:
Código:
<nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
              <span class="icon-bar"></span>                       
            </button>
            <a class="navbar-brand" href="index.php">.........</a>
          </div>
          <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav navbar-right">   
              <li><a href="index.php#aboutUs">Sobre nosostros</a></li>
            </ul>
          </div>
        </div>
      </nav>


Bien, pues este ultimo no funciona, es decir, no hace nada al pinchar encima.
Sin embargo si elimino el '#aboutUs' ya funciona(redirige solo a index.php logicamente), osea esto si funciona:
Código:
<li><a href="index.php">Sobre nosostros</a></li>

¿Que esta pasando aqui y como puedo solucionarlo?

Como detalle tambien decir que si fuera de las etiquetas <nav> pongo esto :
Código:
<a href="index.php#aboutUs">Sobre nosostros</a>
funciona correctamente, por eso pienso que el problema debe estar en bootstrap..
Gracias a todos por vuestra atencion,
Un saludo