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

Prevendo para que a tela não role quando for clicado num anchor link.

Eu bolei uma solução aqui que faz com que a tela role para a posição que estava quando foi clicada, substituindo o:

btn.href= 'javascript:void(0)';

por:

var posY = window.pageYOffset;
window.setTimeout(function(){ window.scrollTo(0, posY) }, 0);

O problema é que a rolagem sobe e depois desce rapidamente, criando um efeito de "piscagem" bem ruim.

Enfim, estou compartilhando aqui até onde cheguei, mas gostaria de saber se tem uma solução mais adequada.

Abraço.

Garanta sua matrícula hoje e ganhe + 2 meses grátis

Continue sua jornada tech com ainda mais tempo para aprender e evoluir

Quero aproveitar agora
3 respostas

Fala ai Vanderson, tudo bem? Porque você gostaria de trocar o javascript:void? Pergunto isso porque acredito que o mesmo atenda muito bem a sua necessidade.

Espero ter ajudado.

Fala Matheus, beleza e você?

Então, para o projeto do curso de acessibilidade, era interessante que o link âncora não rolasse a tela. Usar o javascript:void ou o preventDefault resolvia só que também não trazia o conteúdo do link no carrossel.

Pra explicar mais fácil é melhor ver essa aula, o problema está logo no 00:00 do vídeo.

Valeu.

solução!

Fala Vanderson, nesse caso eu acho que o problema de scrollar a pagina foi uma má implementação do componente.

Se a gente seguir as recomendações da W3C sobre o componeten de carousel: https://www.w3.org/TR/wai-aria-practices-1.1/#carousel

E realizar as escolhas certas na implementação, dificilmente esse problema de slide iria ocorre, digo isso porque ja fiz um slide acessível que não rolava a tela.

Espero ter ajudado.