Diminuir item quando a página é rolada

[mruoppolo 14]

Olá galera, tudo bem?

 

Estou com uma dúvida, no meu site http://vitaclin.com.br/estetica/curitiba/ quando a pessoa rola a página o logo diminui, eu queria fazer todo o header diminuir sumir aquela informação de endereço e telefone e fazer o menu subir um pouco para aumentar a visualização do conteúdo da página, acredito que isso seja feito com @media não é?? Se não for alguém sabe me dizer como faço isso?

 

Valew galera.

[guilomaker 31]

você teria que usar jquery pra adicionar e remover classes com o scroll!

 

ao rolar a pagina 100px por exemplo ele remove suas classes que contem a informação que quer remover, e adiciona uma classe com um header menor e etc.

 

de uma olhada por jquery scrolltop, addclass e removeclass

 

fiz um exemplo pra você

$(function() {
    var header = $(".header-wrapper"); // Variavel da Classe a ser modificada
    var container = $(".header-container"); // Variavel da Classe a ser modificada
    $(window).scroll(function() {
        var scroll = $(window).scrollTop();

        if (scroll >= 150) {
            header.addClass("small"); // Classe a ser adicionada na classe que foi definida na variavel header
            container.removeClass("header-container"); // Classe a ser removida na classe que foi definida na variavel container

        } else {
            // aqui e o que vai acontecer caso a rolagem do scrol seja menor que 150px
            header.removeClass("small"); // Remove a mesma da variael header
            container.addClass('header-container'); // Remove a mesma da variavel container
        }
    });
});

veja o exemplo online!

 

https://jsfiddle.net/p05qr3j9/embedded/result/

 

codigo

 

http://jsfiddle.net/p05qr3j9/

 

ai você edita da forma que for melhor pra você, adicione suas variáveis com as classes a ser atingidas e siga este padrão.

 

onde tem o valor 150 e o valor (y) do scroll, quer dizer que ao rolar a pagina 150px pra baixo ele faz as trocas.

[mruoppolo 14]

ta salvando minha vida hoje, kkk, valew de novo brother

[guilomaker 31]

ta salvando minha vida hoje, kkk, valew de novo brother

 

kkkk tranquilo! estamos ai pra ajudar..