scroll-behavior: smooth

Olá devers,

Eu vi a aula de aplicar o scroll suave mas eu fiz em CSS com a property scroll-behavior: smooth, que foi bem mais simples (apenas 3 linhas de código), e assim como ele aplicar os id's e linkar no href:

html {
    scroll-behavior: smooth;
}

[continuação do cod]

Imagino que o Flavio aplicou me JQuasry porque a proposta é de projeto final pra front end e não html e css.

Mas seria muito mais prático e com o mesmo efeito aplicar direto como propriedade CSS não? ou tem algum ganho fazendo por JS/JQuary? Ou na época do vídeo o recurso ainda não era disponível?

Obrigada desde já.

Gabs

Oi Gabriela!

Primeiramente, parabéns por ter procurado outra solução além do que foi proposto em aula! É muito legal quando isso acontece e isso vai ajudar bastante no seu aprendizado.

O Flávio durante a aula que um dos fatores que temos que levar em consideração no desenvolvimento é o comportamento da página em diferentes navegadores e dispositivos. O scroll-behavior: smooth, apesar de ser mais simples que uma solução em JS, não é suportada por todos os navegadores, como pode ser visto aqui. Por exemplo, o Safari não suporta esta funcionalidade por padrão, sendo assim, o comportamento da página não é igual ao esperado.

A solução em JS, apesar de ser mais verbosa, funciona para todos os navagadores e pode ser feita apenas com JS puro sem o JQuery.

Apesar da sua solução não ser adequada para todos os casos, ainda sim parabéns por ter ido além do que foi ensinado no curso!

Espero ter ajudado! Qualquer outra dúvida pode postar aqui. :)

Chegou a hora de transformar