1

Tengo el siguiente código:

<script type = "text/javascript">
    lightbox.option({
      'alwaysShowNavOnTouchDevices': true
    });
    listapremier();
    $(function(){
                $('a').click(function(e){
                        e.preventDefault();
                        var div = $(this).data('href');
                        var y = $(div).offset().top - 70;
                        $('body,html').stop(true,true).animate({                                
                                scrollTop: y
                        },1000);
                });
        });
</script>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation" style = "padding-bottom: 25px; padding-top: 25px;">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <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="titulogo"  style = "text-decoration: none" href="#"><img src ="img/logo.png"></img></a>
        </div>
        <div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li>
                    <a data-href='#mycarousel' href='#'>INICIO</a>
                </li>
                <li>
                    <a data-href='#nosotros' href='#'>NOSOTROS</a>
                </li>
                <li>
                    <a  data-href='#servicios' href='#'>SERVICIOS</a>
                </li>
                <li>
                    <a  data-href='#propiedades' href='#'>PROPIEDADES</a>
                </li>
                <li>
                    <a  data-href='#contacto' href='#'>CONTACTO</a>
                </li>
                <li>
                    <a href="#" onclick="confiaprop()">CONFIANOS TU PROPIEDAD</a>
                </li>
                <li>
                    <a href="Registro/index.php" style = "background-color: #d5b560; color: black;">ÁREA DE INVERSIONISTAS</a>
                </li>
            </ul>
        </div>
    </div>
</nav><br /><br /><br /><br /><br />

Todo funciona perfecto excepto por este boton:

                <li>
                    <a href="Registro/index.php" style = "background-color: #d5b560; color: black;">ÁREA DE INVERSIONISTAS</a>
                </li>

Es la única que tiene un enlace a otro index sólo me da error cuando inserto el script que tengo arriba en javascript, sin el script si funciona el boton.

1 respuesta 1

1

El problema es por la función e.preventDefault(); de tu javascript.

Te funciona bien con la mayoría de los enlaces del navbar porque están vacíos (no tienen href o este apunta a #) y la acción la resuelves mediante javascript. Pero el último enlace tiene un href bien definido, y el e.preventDefault(); impide que se ejecute (preventDefault = "impedir la acción por defecto", es decir, seguir el href del enlace).

Tu opción sería distinguir de alguna forma los enlaces "normales" (con href) del resto de enlaces del navbar, y sólo estos últimos los manipulas mediante javascript.

Una manera de hacerlo sería modificar las etiquetas <a> del navbar (todas excepto la última) agregándoles una clase distintiva.

<a data-href='#mycarousel' href='#' class="item-menu">INICIO</a>

Y modificar el javascript para que se activen sólo los enlaces que tienen esta clase:

// $('a').click(function(e){           // Esto se elimina
$('a.item-menu').click(function(e){    // y se reemplaza con esto
1
  • Me funciono perfectamente gracias por tu ayuda :) Commented el 10 mar. 2017 a las 2:13

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.