Executando verificação de segurança...
1

Ajuda: preload de imagens

Já resolvido 👍

Usei o element.onload = function(), assim só após ver se a imagem carregou, o código continua. Caso a imagem não carregue, element.onerror = function(), vai entender e muda a direção do código, removendo a parte das imagens.

Problema:
Criei meio que um Site/Quiz, nele quando a pessoa acerta ou erra, mostra a capa do filme da resposta certa (por enquanto só no de AÇÃO, ANIMAÇÃO e AVENTURA), mas não queria subir todas as imagens, então peguei apenas os links e coloquei no Js, mas as vezes não da tempo de carregar a imagem e já passa para a próxima pergunta. Tem como fazer esperar carregar a imagem por completo primeiro??

Obs: Sou iniciante em programação, o código ta bem bagunçado kkkkk mas ta no GitHub: https://roberto-dantas.github.io/Quiz/

Carregando publicação patrocinada...
2

Creio que o correto seria comecar a contar o tempo somente depois que a imagem carregar. Para saber quando a imagem carregou use o evento onload da imagem.

ex.:

<img src="foto.jpg" onload="func" />
1
1

Mano, ajudou mto real, só que em vez de fazer direto na imagem, eu fiz no Js, element.onload = function() e usei tbm o element.onerror = function()

1
2

Além das boas dicas do pessoal aqui, tenha certeza de estar usando links que apontam para imagens com tamanho reduzido! Pra demorar pra carregar uma imagem, hoje em dia, tem que ser graaaande, com alguns MB e pra tela as imagens podem tranquilamente ter dezenas de KB, apenas.

2

Pesquisa sobre uma função chamada setTimeout, não é de longe a melhor solução! mas da pra começar as sentir o gostinho e ver funcionar, vou ver seu codigo e fazer um PR se achar uma solução e podemos continuar heheh

1

kkkk conheço o setTimeout ss, usei bastante la, nessa parte da imagem coloquei uns 2seg, mas mesmo assim tem imagem que não carrega completamente, agradeço mn