SitioWebRake/header.html

<!-- header-area start -->
<div id="sticker" class="header-area">
    <div class="container">
        <div class="row">
            <div class="col-md-12 col-sm-12">

                <!-- Navigation -->
                <nav class="navbar navbar-default">
                    <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".bs-example-navbar-collapse-1" aria-expanded="false">
										<span class="sr-only">Toggle navigation</span>
										<span class="icon-bar"></span>
										<span class="icon-bar"></span>
										<span class="icon-bar"></span>
									</button>
                        <!-- Brand -->
                        <a class="navbar-brand page-scroll sticky-logo" href="index">
                            <img src="assets/logo-slider.png" alt="Rake" width="110px">
                        </a>
                    </div>
                    <!-- Collect the nav links, forms, and other content for toggling -->
                    <div class="collapse navbar-collapse main-menu bs-example-navbar-collapse-1" id="navbar-example">
                        <ul class="nav navbar-nav navbar-right">
                            <li id="navIndex" class="">
                                <a class="page-scroll" href='index'>Inicio</a>
                            </li>
                            <li id="navProductos" class="">
                                <a class="page-scroll" href='productos'>Productos</a>
                            </li>
                            <li class="dropdown" id="navServicios"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Servicios<span class="caret"></span></a>
                                <ul class="dropdown-content" role="menu">
                                    <li><a href='asesoria'>Asesoría Técnica</a></li>
                                    <li><a href='bodega'>Arrendamiento de Bodegas</a></li>
                                    <li><a href='blog'>Trabajos de Campo</a></li>
                                </ul>
                            </li>
                            <li class="dropdown" id="navEmpresa"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Empresa<span class="caret"></span></a>
                                <ul class="dropdown-content" role="menu">
                                    <li><a href='empresa'>¿Quiénes Somos?</a></li>
                                    <li><a href='historia'>Historia</a></li>
                                    <li><a href='bolsaTrabajo'>Trabaja con Nosotros</a></li>
                                </ul>
                            </li>

                            <li id="navContacto" class="">
                                <a class="page-scroll" href="#contact">Contacto</a>
                            </li>

                        </ul>
                    </div>
                    <!-- navbar-collapse -->
                </nav>
                <!-- END: Navigation -->
            </div>
        </div>
    </div>
</div>
<!-- header-area end -->

<script type="text/javascript">
    let url = window.location.href;
    if (url.indexOf('index') != -1) document.getElementById("navIndex").setAttribute("class", "active");
    if (url.indexOf('asesoria') != -1 ||
        url.indexOf('bodega') != -1 ||
        url.indexOf('blog') != -1)
        document.getElementById("navServicios").setAttribute("class", " dropdown active");
    if (url.indexOf('empresa') != -1 ||
        url.indexOf('historia') != -1 ||
        url.indexOf('bolsaTrabajo') != -1)
        document.getElementById("navEmpresa").setAttribute("class", " dropdown active");
    if (url.indexOf('productos') != -1 ||
        url.indexOf('marca') != -1)
        document.getElementById("navProductos").setAttribute("class", "active");
</script>