Skip to main content
3 de 4
se eliminaron 4 caracteres en el cuerpo

Cambiar color del ítem seleccionado en un menú de Blogger

He seguido varios de los ejemplos de este post, pero no ha funcionado en Blogger al momento de cambiar la almohadilla (#) por una URL.

Inserté lo siguiente en el <head> del documento.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main">

Además, inserté el HTML en un gatget:

<div id="main">
<ul>
    <li><a id="inicio" href="http://bpbmsm.blogspot.pe/">Inicio</a></li>
    <li><a id="nosotros" href="http://bpbmsm.blogspot.pe/p/pagina1">Sobre nosotros</a></li>
    <li><a id="producto" href="http://bpbmsm.blogspot.pe/p/pagina2">Producto</a></li>
    <li><a id="contacto" href="http://bpbmsm.blogspot.pe/search/label/etiqueta1">Contacto</a></li>
</ul>
</div>

Todo lo demás lo dejé como estaba.

Por otro lado, el siguiente script, también lo inserté dentro del head:

$(function() {
  $("#main ul li a").click(function() {
    // quitar .seleccionado a todos (por si hay alguno)
    $("#main ul li a").removeClass("seleccionado");
    // agregar seleccionado a "este" elemento.
    $(this).addClass("seleccionado");
  });
});

Utilizo este blog para probar: http://bpbmsm.blogspot.pe/