Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Скрыть div по времени и если мышь вне его (https://javascript.ru/forum/misc/80371-skryt-div-po-vremeni-i-esli-mysh-vne-ego.html)

korifey 28.05.2020 16:54

Скрыть div по времени и если мышь вне его
 
Нужно что бы пока мышь находиться в нижнем div он бы не скрывался как в видеоплеерах.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="gl" style="overflow: hidden;width:100%;height:400px;background-color:red;position:relative">
    <div id="block" style="width: 100%;height:50px;position:absolute;background-color: aqua;bottom:0">
        <div style="float: left; width: 100px; height:30px;background-color: brown;margin-left:20px">content</div>
        <div style="float: left; width: 100px; height:40px;background-color: aliceblue;margin-left:40px"><p style="width:100%;height:100%">content</p></div>
        <div style="float: left; width: 100px; height: 20px;margin-left:10px;background-color:coral">content++</div>
    </div>
</div>
<script>
    var timer;
    document.getElementById('gl').onmousemove = function() {
      document.getElementById('block').style.display = "none";
      clearTimeout(timer);
      timer = setTimeout(function() {
        document.getElementById('block').style.display = "block";
      }, 3000)
    };
</script>    
</body>
</html>


Часовой пояс GMT +3, время: 06:21.