Algo errado em meu exercicio de html/javascript... nao funciona como deveria

JavaScript

HTML5

09/11/2019

nao funciona de jeito nenhum em nenhum navegador... esta tudo certo! meu chrome e firefox estao atualizados, meu notepad++ esta atualizado... o navegador carrega a imagem lampada-apagada.jpg mas, quando passo o mouse por cima da imagem e tiro ele de cima da imagem, a imagem lampada-acesa.jpg nao carrega!
sera que a sintaxe mudou?? o material que estou vendo ja foi criado ha algun anos... o que esta errado?

<!DOCTYPE html>
<html lang="pt-br">
 <head>
  <title>Teste JavaScript</title>
  <meta charset="UTF-8"/>
  <script>
   function acendeLampada() {
    document.getElementById("luz").src="downloads\projeto-glass-html5\_imagens\lampada-acesa.jpg";
   }
   function apagaLampada() {
    document.getElementById("luz").src="downloads\projeto-glass-html5\_imagens\lampada-apagada.jpg";
   }
  </script>
 </head>
 <body>
  <h1>Acenda a lâmpada</h1>
  <img src="downloads\projeto-glass-html5\_imagens\lampada-apagada.jpg" id="luz" onmousemove="acendeLampada()" onmouseout="apagaLampada"/>
 </body>
</html>
Thiago

Thiago

Curtidas 0

Respostas

Jorge Pinto

Jorge Pinto

09/11/2019

nao funciona de jeito nenhum em nenhum navegador... esta tudo certo! meu chrome e firefox estao atualizados, meu notepad++ esta atualizado... o navegador carrega a imagem lampada-apagada.jpg mas, quando passo o mouse por cima da imagem e tiro ele de cima da imagem, a imagem lampada-acesa.jpg nao carrega!
sera que a sintaxe mudou?? o material que estou vendo ja foi criado ha algun anos... o que esta errado?

<!DOCTYPE html>
<html lang="pt-br">
 <head>
  <title>Teste JavaScript</title>
  <meta charset="UTF-8"/>
  <script>
   function acendeLampada() {
    document.getElementById("luz").src="downloads\\projeto-glass-html5\\_imagens\\lampada-acesa.jpg";
   }
   function apagaLampada() {
    document.getElementById("luz").src="downloads\\projeto-glass-html5\\_imagens\\lampada-apagada.jpg";
   }
  </script>
 </head>
 <body>
  <h1>Acenda a lâmpada</h1>
  <img src="downloads\\projeto-glass-html5\\_imagens\\lampada-apagada.jpg" id="luz" onmousemove="acendeLampada()" onmouseout="apagaLampada"/>
 </body>
</html>


Olá Thiago !! Tudo bem ??

Fiz pequenas alterações no seu código, baixei duas imagens de lâmpadas apaga e acesa da internet e coloquei numa pasta chamada images na raiz do projeto. Veja o código como ficou...
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->

<html lang="pt-br">
 <head>
  <title>Teste JavaScript</title>
  <meta charset="UTF-8"/>
  <script>
   function acendeLampada() {
    document.getElementById("luz").src="images/lampada_acesa.jpg";
   }
   function apagaLampada() {
    document.getElementById("luz").src="images/lampada_apagada.jpg";
   }
  </script>
 </head>
 <body>
  <h1>Acenda a lâmpada</h1>
  <img src="images/lampada_apagada.jpg" id="luz" onmousemove="acendeLampada()" onmouseout="apagaLampada()"/>
 </body>
</html>


além das imagens e seus respectivos paths eu ainda inclui os parenteses na chamada da função em onmouseout="apagaLampada" na linha 23.

Rodou 100% aqui...

Testa aí e veja se funciona... qualquer dúvida posta novamente...

Abraço e bons códigos.
GOSTEI 0
Thiago

Thiago

09/11/2019

obrigado Jorge, mas... nem vou mais brincar com html... estou aprendendo python, agora.
e eu descobri o que estava dando errado... nas tags <img>, nos parametros src, eu estava colocando a barra assim: \\ entao eu resolvi trocar essas barras por outras barras, assim: / e deu certo... so fiz isso hahahah

mas valeu pela disposição!!
GOSTEI 0
POSTAR