Skip to main content
Pergunta fechada como "Não é adequada para este site" por Largato

O código a seguir é capaz de realizar a seguinte tarefa  : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique.

  • Ao clicar no botão "Criar Quadrado", um quadrado vermelho é renderizado na tela em cada clique.

Desejo que, ao passar o mouse por cima destes quadrados gerados, estes troquem de cor. 

Segue o código :

<html>
  <head>
    <meta charset="UFT-8" />
    <title></title>
  </head>

  <body>
    <div id="container"></div>
    <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
    <script>
      function criarQuadrado() {
        var boxElement = document.createElement("div");
        boxElement.style.width = 300;
        boxElement.style.height = 300;
        boxElement.style.display = "inline-block";
        boxElement.style.backgroundColor = "#f00";

        var container = document.getElementById("container");
        container.appendChild(boxElement);
      }
</script>
  </body>
</html>
<html>
      <head>
        <meta charset="UFT-8" />
        <title></title>
      </head>
    
      <body>
        <div id="container"></div>
        <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
        <script>
          function criarQuadrado() {
            var boxElement = document.createElement("div");
            boxElement.style.width = 300;
            boxElement.style.height = 300;
            boxElement.style.display = "inline-block";
            boxElement.style.backgroundColor = "#f00";
    
            var container = document.getElementById("container");
            container.appendChild(boxElement);
          }
    </script>
      </body>
    </html>
function getRandomColor() {
    var letters = "0123456789ABCDEF";
    var color = "#";
    for (var i = 0; i < 6; i++) {
      color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
 }
 var newColor = getRandomColor(); 
function getRandomColor() {
        var letters = "0123456789ABCDEF";
        var color = "#";
        for (var i = 0; i < 6; i++) {
          color += letters[Math.floor(Math.random() * 16)];
        }
        return color;
}
var newColor = getRandomColor();

O código a seguir é capaz de realizar a seguinte tarefa  : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código :

<html>
  <head>
    <meta charset="UFT-8" />
    <title></title>
  </head>

  <body>
    <div id="container"></div>
    <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
    <script>
      function criarQuadrado() {
        var boxElement = document.createElement("div");
        boxElement.style.width = 300;
        boxElement.style.height = 300;
        boxElement.style.display = "inline-block";
        boxElement.style.backgroundColor = "#f00";

        var container = document.getElementById("container");
        container.appendChild(boxElement);
      }
</script>
  </body>
</html>
function getRandomColor() {
    var letters = "0123456789ABCDEF";
    var color = "#";
    for (var i = 0; i < 6; i++) {
      color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
 }
 var newColor = getRandomColor(); 

O código a seguir é capaz de realizar a seguinte tarefa:

  • Ao clicar no botão "Criar Quadrado", um quadrado vermelho é renderizado na tela em cada clique.

Desejo que, ao passar o mouse por cima destes quadrados gerados, estes troquem de cor. 

Segue o código :

<html>
      <head>
        <meta charset="UFT-8" />
        <title></title>
      </head>
    
      <body>
        <div id="container"></div>
        <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
        <script>
          function criarQuadrado() {
            var boxElement = document.createElement("div");
            boxElement.style.width = 300;
            boxElement.style.height = 300;
            boxElement.style.display = "inline-block";
            boxElement.style.backgroundColor = "#f00";
    
            var container = document.getElementById("container");
            container.appendChild(boxElement);
          }
    </script>
      </body>
    </html>
function getRandomColor() {
        var letters = "0123456789ABCDEF";
        var color = "#";
        for (var i = 0; i < 6; i++) {
          color += letters[Math.floor(Math.random() * 16)];
        }
        return color;
}
var newColor = getRandomColor();
adicionou 144 caracteres ao conteúdo
Fonte Link
Sergio
  • 135,1mil
  • 16
  • 201
  • 294

O código a seguir é capaz de realizar a seguinte tarefa : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código :

Criar quadrado function criarQuadrado() { var boxElement = document.createElement("div"); boxElement.style.width = 300; boxElement.style.height = 300; boxElement.style.display = "inline-block"; boxElement.style.backgroundColor = "#f00";
<html>
  <head>
    <meta charset="UFT-8" />
    <title></title>
  </head>

  <body>
    <div id="container"></div>
    <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
    <script>
      function criarQuadrado() {
        var boxElement = document.createElement("div");
        boxElement.style.width = 300;
        boxElement.style.height = 300;
        boxElement.style.display = "inline-block";
        boxElement.style.backgroundColor = "#f00";

        var container = document.getElementById("container");
        container.appendChild(boxElement);
      }
</script>
  </body>
</html>
  

A função quer será responsável por gerar as mudanças de cores é a seguinte :

function getRandomColor() { var letters = "0123456789ABCDEF"; var color = "#"; for (var i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color; } var newColor = getRandomColor();

function getRandomColor() {
    var letters = "0123456789ABCDEF";
    var color = "#";
    for (var i = 0; i < 6; i++) {
      color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
 }
 var newColor = getRandomColor(); 

Como posso resolver tal problema?

O código a seguir é capaz de realizar a seguinte tarefa : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código :

Criar quadrado function criarQuadrado() { var boxElement = document.createElement("div"); boxElement.style.width = 300; boxElement.style.height = 300; boxElement.style.display = "inline-block"; boxElement.style.backgroundColor = "#f00";
    var container = document.getElementById("container");
    container.appendChild(boxElement);
  }
 

A função quer será responsável por gerar as mudanças de cores é a seguinte :

function getRandomColor() { var letters = "0123456789ABCDEF"; var color = "#"; for (var i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color; } var newColor = getRandomColor();

Como posso resolver tal problema?

O código a seguir é capaz de realizar a seguinte tarefa : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código :

<html>
  <head>
    <meta charset="UFT-8" />
    <title></title>
  </head>

  <body>
    <div id="container"></div>
    <button type="button" onclick="criarQuadrado()">Criar quadrado</button>
    <script>
      function criarQuadrado() {
        var boxElement = document.createElement("div");
        boxElement.style.width = 300;
        boxElement.style.height = 300;
        boxElement.style.display = "inline-block";
        boxElement.style.backgroundColor = "#f00";

        var container = document.getElementById("container");
        container.appendChild(boxElement);
      }
</script>
  </body>
</html>
 

A função quer será responsável por gerar as mudanças de cores é a seguinte :

function getRandomColor() {
    var letters = "0123456789ABCDEF";
    var color = "#";
    for (var i = 0; i < 6; i++) {
      color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
 }
 var newColor = getRandomColor(); 

Como posso resolver tal problema?

Fonte Link

Mudança de cores ao passar o mouse

O código a seguir é capaz de realizar a seguinte tarefa : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código :

Criar quadrado function criarQuadrado() { var boxElement = document.createElement("div"); boxElement.style.width = 300; boxElement.style.height = 300; boxElement.style.display = "inline-block"; boxElement.style.backgroundColor = "#f00";
    var container = document.getElementById("container");
    container.appendChild(boxElement);
  }

A função quer será responsável por gerar as mudanças de cores é a seguinte :

function getRandomColor() { var letters = "0123456789ABCDEF"; var color = "#"; for (var i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color; } var newColor = getRandomColor();

Como posso resolver tal problema?