Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Aula 6 - Animação

Referente ao curso Bootstrap: velocidade no front-end

por Hilton Muccillo
| 36.9k xp | 28 posts
Desenvolvedor Front End

Boa noite já visualizei as duvidas de todos mas não há uma semelhante a minha, portanto vou postar aqui.

Quanto a visualização no Iphone 4 pelo Chrome. No vídeo 6.2, o professor atribui links e âncoras ao menu e ao conteúdo que está na tag main do index.html. Minha dúvida é a seguinte: Quando clico ou em Novidades, ou em Mais Vendidos ou até no logo(home) o conteúdo retorna a posição mas fica encoberto pela barra de navegação. Como faço para por exemplo, ao clicar em Novidades (#novidades) e seu conteúdo não ficar atrás do menu.

Desde já agradeço, abs Hilton.

2 respostas
solução!
por Yuri Padilha
| 152.5k xp | 226 posts
Instrutor Desenvolvedor e Instrutor

Bom dia Hilton, Para solucionar isso o melhor a se fazer é pedir para quando vc clicar nessas âncoras ele descer a tela um pouco menos do que deveria.

// A classe nav-link se refere aos meus links <a>.
$('.nav-link').click(function(){
    $('html, body').animate({
        // 5 px a menos
        scrollTop: $( $.attr(this, 'href') ).offset().top - 5
    }, 500);
    return false;
});

Nesse caso o JQuery que usei acima faz com que ele desça 5px a menos. Vc pode alterar esse valor se quiser.

Espero ter ajudado, abraços!

por Hilton Muccillo
| 36.9k xp | 28 posts
Desenvolvedor Front End

Obrigado Yuri! Funcionou perfeito! Valeu! ;)