Curso de jQuery | Hacer un filtro 1

Curso de jQuery
Hacer un filtro

Curso de jQuery | Hacer un filtro 2

Al pulsar sobre un enlace, las capas de colores inferiores deben filtrarse en función del enlace pulsado. Para ello, recorreremos todas las capas, añadiendo o eliminando el class «oculta» en el caso de que el href (con #) del enlace coincida con alguno de los class de la capa

Utilizaremos el siguiente código CSS:

.oculta{
	overflow:hidden;
	animation: ocultar 0.5s;
	animation-fill-mode: forwards
}

@keyframes ocultar{
	to{
		width: 0;
		height: 0;
		margin: 0;
		border:0;
	}
}

Menús

Menú que desaparece al hacer scroll down

var $mywindow = $(window);
var mypos = $mywindow.scrollTop();
$mywindow.scroll(function() {
	if($mywindow.scrollTop() > mypos){
		$('.site-header').fadeOut();
	}else{
		$('.site-header').fadeIn();
	}
	mypos = $mywindow.scrollTop();
});

Ejercicio – Menú que se solapa arriba

$(window).scroll(function(){

});

var scrollTop = $(window).scrollTop();

distanciaInicial = $('.nav').offset().top;

//Si scrollTop es mayor que la distancia inicial añado un class para pegar el menú arriba
Ver ejercicio propuesto
Ver ejercicio resuelto