Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Como deixar o código funcional para diversos navegadores?

Percebi que várias pessoas estão com dúvidas em um problema que também tive. Para alguns navegadores o código de scroll passado no curso não funcionava, em especial no Google Chrome:

$(" body").animate(
    {
        scrollTop: posicaoPlacar+"px"
    }, 1000);

A solução seria:

$("html, body").animate(
    {
        scrollTop: posicaoPlacar
    }, 1000);

Ainda assim, há navegadores que necessitam a concatenação da posição do placar com o "px" e outros (como o meu), que não necessitam.

OK, todos resolvemos o problema individualmente, cada qual adaptando seu código para seu navegador.

Mas ficou a dúvida: como fazer um código que funcione para todos os navegadores? Ou pelo menos para a maioria? Pois afinal, quando programamos, temos que pensar nas diversas singularidades de nossos clientes que vão possuir sistemas operacionais e navegadores variados.

2 respostas
solução!

Eduardo, boa tarde!

Ótima observação, na realidade o uso do JQuery é justamente para que seu código funcione em diversos navegadores! Ao usar da segunda forma, nós estamos garantindo que o código irá funcionar nos mais diversos navegadores, você pode testar! E você pode também adicionar o px no final que terá o mesmo efeito

$("html, body").animate(
    {
        scrollTop: posicaoPlacar +'px'
    }, 1000);
}

Espero ter ajudado e bons estudos!

Felipe, agradeço pelo retorno!

Fiz o teste com seu código nos navegadores que possuo (Edge, Chrome, Mozilla e IExplorer) e de fato funcionaram!

Acho que seria interessante uma nota sobre isto no curso já que no vídeo o código passado não funciona em muitos navegadores e temos que quebrar um pouco a cabeça para resolver.

Valeu!