Entrar Ainda não tem acesso?
2
respostas

imagem nao parece

Referente ao curso JavaScript: manipulando elementos no DOM, no capítulo Manipulando elementos da página e atividade Alterando imagens

por Flávio Henrique Martins Silva
| 44.1k xp | 5 posts
const html =document.querySelector('html')
const focoBt=document.querySelector('.app__card-button--foco')
const curtoBt=document.querySelector('.app__card-button--curto')
const longoBt=document.querySelector('.app__card-button--longo')
const banner=document.querySelector('.app__image')


focoBt.addEventListener('click',() =>{
    html.setAttribute('data-contexto','foco')
    banner.setAttribute('src' , '"/imagens/foco.png')
})
curtoBt.addEventListener('click',() =>{
    html.setAttribute('data-contexto','descanso-curto')
})
longoBt.addEventListener('click',() => {
    html.setAttribute('data-contexto', 'descanso-longo')
})

como posso saber se e uma falha normal ou nao, se o meu pc ou nao? nao tenho conhcimento nem um de informaica

2 respostas
por Victor Costa Santos
| 1919k xp | 3680 posts
Alura Scuba Team Monitor de ForumOps

Oi Flávio!

Notei que no trecho do código onde você altera o src da imagem, há uma pequena diferença que pode estar causando o problema. Veja a linha:

banner.setAttribute('src' , '"/imagens/foco.png')

Perceba que há uma aspa extra antes do caminho da imagem. Isso pode estar impedindo que o caminho seja lido corretamente pelo navegador. Tenta corrigir essa linha para:

banner.setAttribute('src', '/imagens/foco.png')

Reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso ✨

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!
por Paolla Sophia Mezzenga
| 44.1k xp | 1 posts

Tive um problema parecido, as imagens nem ao menos carregavam no navegador (percebi que acontecia com as imagens de foco, descanso curto, descanso longo, logo, e o sinal de play) , pesquisei um pouco e consegui resolver colocando um ponto (.) antes do endereço das imagens (mudando de "/imagens/foco.png" para "./imagens/foco.png", tanto no arquivo index.html, quanto no script.js, só assim consegui carregar as imagens, as alterações ficaram assim:

html (antigo)

<figure class="app__image-figure">
                <img class="app__image" src="/imagens/foco.png" alt="">
            </figure>

html(com alterações)

<figure class="app__image-figure">
                <img class="app__image" src="./imagens/foco.png" alt="">
            </figure>

script.js

focoBt.addEventListener('click', () => {
    html.setAttribute('data-contexto' , 'foco')
    banner.setAttribute('src', './imagens/foco.png')
})

Não sei se é o mesmo problema, mas espero ter ajudado <3