Si la URL de algún botón es = a la url de la página actual...
Publicado por kwk3 (8 intervenciones) el 27/06/2020 14:42:43
Hola,
estoy buscando la forma de cambiar el estilo de un botón cuando la url de ese botón sea la actual.
por ejemplo:
Si en una ficha de producto (producto.com) hay cuatro botones: Inicio (que lleva a producto.com/inicio), reviews ( producto.com/reviews), ofertas ( producto.com/ofertas), distribuidores ( producto.com/distribuidores).
Necesito que al estar en la página Inicio (producto.com/inicio) el botón "Inicio" cambie de color.
Que al estar en la página reviews (producto.com/reviews) el botón "reviews" cambie de color.
Que al estar en la página ofertas (producto.com/ofertas) el botón "ofertas" cambie de color... Etc...
Sería crear el estilo de css :active pero desde javascript y al detectar que la current page es el link de uno de los botones.
He visto estos ejemplos por la red, pero es de jQuery, y soy muy malo para pasar de jquery a javascript y viceversa... ¿Alguien me echa una mano?
EJEMPLO 1
EJEMPLO 2
estoy buscando la forma de cambiar el estilo de un botón cuando la url de ese botón sea la actual.
por ejemplo:
Si en una ficha de producto (producto.com) hay cuatro botones: Inicio (que lleva a producto.com/inicio), reviews ( producto.com/reviews), ofertas ( producto.com/ofertas), distribuidores ( producto.com/distribuidores).
Necesito que al estar en la página Inicio (producto.com/inicio) el botón "Inicio" cambie de color.
Que al estar en la página reviews (producto.com/reviews) el botón "reviews" cambie de color.
Que al estar en la página ofertas (producto.com/ofertas) el botón "ofertas" cambie de color... Etc...
Sería crear el estilo de css :active pero desde javascript y al detectar que la current page es el link de uno de los botones.
He visto estos ejemplos por la red, pero es de jQuery, y soy muy malo para pasar de jquery a javascript y viceversa... ¿Alguien me echa una mano?
EJEMPLO 1
1
2
3
$('ul > li a[href]').filter(function() {
return this.href.pathname === window.location.pathname;
}).css('font-weight','bold');
EJEMPLO 2
1
2
3
4
5
6
7
$(function(){
$("a").each(function(){
if ($(this).attr("href") == window.location.pathname){
$(this).addClass("selected");
}});
});
Valora esta pregunta
0
