-3
<html>
<head>

  <meta charset="utf-8">

  <br><center><font face="Helvetica" color=black size=7><b>DOM CASMURRO</b></font></center>

  <div align="center">

    <p><font face="Helvetica" color=black size=6><b>DICA: Nome da personagem protagonista citada no seguinte trecho:</b></font><br></p>

    <br><p><font face="Helvetica" color=black size=6><b>"Olhos de cigana oblíqua e dissimulada."<br></b></font><br></p>
  </div>


  <script type="text/javascript">
    var palavra=new Array();
    var controlando=0;
    var cont=0;
    var tracos=[];
        var conpt=0;//controle
        var jogadas=6;

        function preencher(valor) {
          var elemento = document.getElementById("tela");
          var value = elemento.value;
          if (controlando == 0) {
            elemento.value = value + valor;
          }
          if (controlando == 1) {
            preenchimento(valor);
          }
        }


        function preenchimento(valor){
          var elemento = document.getElementById("resp");
          var value= elemento.value;
          var checando=0;

          var conpt = false;
          for (var i = 0; i < palavra.length; i++) {
            if (valor == palavra[i]) {
              tracos[i] = valor;
              document.getElementById(valor).disabled = true;
              conpt = true;
            }
          }


          if (!conpt){

            jogadas = jogadas - 1;

             if (jogadas == 6){

              alert("você possui mais 6 tentativas");

            }

            if (jogadas == 5){
              alert("você possui mais 5 tentativas");

            }

            if (jogadas == 4){
              alert("você possui mais 4 tentativas");

            }


            if (jogadas == 3){
              alert("você possui mais 3 tentativas");

            }


            if (jogadas == 2){
              alert("você possui mais 2 tentativas");

            }


            if (jogadas == 1){
              alert("você possui mais 1 tentativas");


            }


            if (jogadas == 0){

              alert("você perdeu! Tente Novamente!");
              location.href="jogodaforca.html";
            }
          }



            elemento.value=tracos;

          }



          function backspace(campo) {
            valor = campo.value;
            tamanho = valor.length
            campo.value = valor.substring(0, tamanho-1)
          }
          function iniciar(tela){
            var copia= tela.value;
        document.getElementById("tela").disabled = 1; //checar se pode
        palavra=copia;
        controlando=1;
        criarTracos();
      }

          function finalizar(tela){
        alert("Você Concluiu a Atividade!");
              location.href="jogodaforca.html";
            }

      function criarTracos(valor){
        var elemento = document.getElementById("resp");
        var tam = palavra.length;
        for (var i=0; i<tam;i++)
          {tracos[i]="__";}
        elemento.value=tracos;

      }
    </script>

  </head>
  <body>

    <div align="center">
      <img src="img6.jpg"  br clear="left">
      <div id="all" >

       <div id="campo">
        <span style="display: none">
          Palavra: <input type="password" id="tela" value="CAPITU" readonly="true"/></span>
          <br><br>
          <input type="text" id="resp" value="" onload="criarTracos();"/>
          <div id="teclas">
           <br>
           <input type="button" value="Q" id="Q" onClick="preencher(value);" >
           <input type="button" value="W" id="W" onClick="preencher(value);"   >
           <input type="button" value="E" id="E" onClick="preencher(value);" >
           <input type="button" value="R" id="R" onClick="preencher(value);"  >
           <input type="button" value="T" id="T" onClick="preencher(value);">
           <input type="button" value="Y" id="Y" onClick="preencher(value);">
           <input type="button" value="U" id="U" onClick="preencher(value);">
           <input type="button" value="I" id="I" onClick="preencher(value);">
           <input type="button" value="O" id="O" onClick="preencher(value);">
           <input type="button" value="P" id="P" onClick="preencher(value);">

           <br>
           <br>
           <input type="button" value="A" id="A" onClick="preencher(value);">
           <input type="button" value="S" id="S" onClick="preencher(value);">
           <input type="button" value="D" id="D" onClick="preencher(value);" >
           <input type="button" value="F" id="F" onClick="preencher(value);">
           <input type="button" value="G" id="G" onClick="preencher(value);">
           <input type="button" value="H" id="H" onClick="preencher(value);" >
           <input type="button" value="J" id="J" onClick="preencher(value);">
           <input type="button" value="K" id="K" onClick="preencher(value);">
           <input type="button" value="L" id="L" onClick="preencher(value);">
           <br>
           <br>
           <input type="button" value="Z" id="Z" onClick="preencher(value);">
           <input type="button" value="X"id="X" onClick="preencher(value);">
           <input type="button" value="C" id="C" onClick="preencher(value);" >
           <input type="button" value="V" id="V" onClick="preencher(value);">
           <input type="button" value="B" id="B" onClick="preencher(value);">
           <input type="button" value="N" id="N" onClick="preencher(value);">
           <input type="button" value="M" id="M" onClick="preencher(value);" >
           <br>
           <br>
           <br>
         </div>
         <br />
         <input type="button"  value="iniciar" id="iniciar" onClick="iniciar(tela);" >
         <input type="button"  value="finalizar" id="finalizar" onClick="finalizar(tela);" >
       </div>
     </div>
   </div>


 </body>
 </html>
0

1 Resposta 1

0

É Bem simples, coloquei uma div com o id="situacao" e você pode inserir a imagem das partes dos corpos pouco a pouco, por ex: com um erro a imagem 1 seria a cabeça, com dois erros a cabeça e o tronco, depois uma imagem com a cabeça o tronco e o braço esquerdo, e a cada erro ele vai colocando a imagem de acordo com o numero de erros.

no final do código html insira essa div

<div>
    <p>você esta morrendo</p>
    <div id="situacao"></div>
</div>

Altere essa parte do código por isso:

if (jogadas == 6){        
    alert("você possui mais 6 tentativas");
    document.getElementById("log").innerHTML="<img src='img6.png' /><p>6</p>";
}

if (jogadas == 5){
    alert("você possui mais 5 tentativas");
    document.getElementById("log").innerHTML="<img src='img5.png' /><p>5</p>";
}

if (jogadas == 4){
    alert("você possui mais 4 tentativas");
    document.getElementById("log").innerHTML="<img src='img4.png' /><p>4</p>";
}


if (jogadas == 3){
    alert("você possui mais 3 tentativas");
    document.getElementById("situacao").innerHTML="<img src='img3.png' /><p>3</p>";
}


if (jogadas == 2){
    alert("você possui mais 2 tentativas");
    document.getElementById("situacao").innerHTML="<img src='img2.png' /><p>2</p>";
}


if (jogadas == 1){
    alert("você possui mais 1 tentativas");
    document.getElementById("situacao").innerHTML="<img src='img1.png' /><p>1</p>";
}


if (jogadas == 0){

    alert("você perdeu! Tente Novamente!");
    document.getElementById("situacao").innerHTML="<img src='img.png' /><p>0</p>";
    location.href="jogodaforca.html";
}

lembre-se de alterar o src de img para a imagem correspondente, seguindo o que te falei acima. quando tiver no erro 6 mostra uma img só com 1 parte do corpo, no 5 com duas partes e assim por diante.

1
  • 1
    OBRIGADOOOOO! DEU CERTINHO! Commented 28/11/2019 às 16:54

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .