Academic Integrity: tutoring, explanations, and feedback — we don’t complete graded work or submit on a student’s behalf.

Hi THere, This is an HTML-Javascript assignment, I need to have a mouseout event

ID: 3880247 • Letter: H

Question

Hi THere,
This is an HTML-Javascript assignment, I need to have a mouseout event that when you click out of the cell it goes back to original color.

Here is what I have for the onclick:

for (row = 1; row <= 10; row++){

for ( col = 1; col <= 10; col++){

document.getElementById('r' + row + 'c' + col).onclick = getCell;

document.getElementById('r' + row + 'c' + col).moveout = getCell;

unction getCell(evt){

var thisCell;

if (evt) thisCell = evt.target; //All browsers but IE.

else thisCell = window.event.srcElement; //The browser is IE

if (thisCell.className == "mulCell"){

thisCell.className = "pickedCell"; // highlight the background

}

//console.log(thisCell.id);

document.getElementById("message").innerHTML = thisCell.id + " = " + document.getElementById(thisCell.id).innerHTML;

}

//I need the missing code, or what should I put in here?

function clearCell(evt){

//To finish the assignment you will be putting code similar to what is in the getCell() function.

Explanation / Answer

You can achive this using folling code:

<html>
<body>
<head>
<script>
function Onclick(ele) {
ele.style.background = "Green";
}

function mouseOut(ele) {
ele.style.background = "white";
}
</script>
</head>
<body>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>Table Cell 1</td>
<td>Table Cell 2</td>
<td>Table Cell 3</td>
</tr>
<tr>
<td>Table Cell 4</td>
<td>Table Cell 5</td>
<td>Table Cell 6</td>
</tr>
<tr>
<td>Table Cell 7</td>
<td>Table Cell 8</td>
<td>Table Cell 9</td>
</tr>
</table>
</body>
</html>

Hire Me For All Your Tutoring Needs
Integrity-first tutoring: clear explanations, guidance, and feedback.
Drop an Email at
drjack9650@gmail.com
Chat Now And Get Quote