Well, what I said, I'm trying to make a div, defined in css as "hidden", appear when I hover over it with "onmouseover" and that, when I remove it, it hides again with "onmouseout". But it doesn't work, it's as if that block wasn't there. I have tried to define it as visible of the html tag and the "onmouseout" works perfectly, but "onmousever" still does not work
As always thank you very much
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div>hola</div>
<div id="bloque" style="visibility: hidden;">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Qui hic
assumenda similique aut blanditiis est atque molestias, reiciendis
facere minima obcaecati velit molestiae architecto rerum facilis libero
dolore magni quo!</div>
<script>
function mostrar(){
var trozo = document.getElementById("bloque");
trozo.style.visibility = "visible";
}
function ocultar(){
var trozo = document.getElementById("bloque");
trozo.style.visibility = "hidden";
}
var trozo = document.getElementById("bloque");
trozo.onmouseout = ocultar;
trozo.onmouseover = mostrar;
</script>
</body>
If you hide the div with hidden, the mouserover trigger never fires.
One solution may be to use a parent div to toggle the child div on or off. It would be something like this: