Форум

Грабовский · #1 (**permalink**) 17.05.2012, 11:45

как узнать что курсор после setTimeout() наведен на объект
Задача такая: навели курсор на объект #nav, заработал setTimeout(), прошла 1 секунда, И если курсор до сих пор наведен на этот же объект то зарабатывает alert().

$('#nav').hover(function(){
	setTimeout(function(){ alert("нецен "); }, 1000);
},function(){
	alert('отвел');
});

используется jquery

GuardCat · #2 (**permalink**) 17.05.2012, 12:16

<p>Наведите и подождите</p>

<script>
  var globalId, p = document.querySelector("p");

  function makeAlert() {
    alert("Вы терпеливы!")
  }

  p.onmouseover = function() {
    globalId = setTimeout(makeAlert, 1000);
  }
  
  p.onmouseout = function() {
    clearTimeout(globalId);
  }
</script>

P.S. JQuery не знаю, прошу прощения. Возможно сможете сделать по аналогии.

Грабовский · #3 (**permalink**) 17.05.2012, 12:24

clearTimeout() конечно же!
как я не догодался.
Спасибо, GuardCat.

bot87 · #4 (**permalink**) 17.05.2012, 12:56

GuardCat не могу навешать через addEventListener.Помоги пожалуйста.

<style type="text/css">
div{width:100px;height:100px;
border:1px solid red;}
</style>
</head>
<body>
<div id="block"></div>
<script>
block=document.getElementById('block')
handler=function(){
	setTimeout(function(){
block.style.backgroundColor='red'
},2000)
}
handler2=function(){clearTimeout(handler)}

block.addEventListener('mouseover',handler,false)
block.addEventListener('mouseout',handler2,false)
</script>

GuardCat · #5 (**permalink**) 17.05.2012, 13:08

bot87,

1. Скажите, вы так отступы сами ставите или поломалось при копировании? Все глаза сломал, блин.
2. Дело не в addEventListener. Дело в том, что clearTimeout в качестве параметра принимает не handler, а номер, который возвращается функцией setTimeout при установке таймера. Надо как-то так:

<head>
  <style type="text/css">
    div {
      width:  100px;
      height: 100px;
      border: 1px solid red;
    }
  </style>
</head>
<body>
  <div id="block"></div>
  <script>
    var id; // Завели глобальную переменную
    block = document.getElementById('block')
    handler = function(){
      id = setTimeout( /*получили номерок*/
        function(){
          block.style.backgroundColor='red'
        },
        2000
      )
    }
    handler2 = function(){clearTimeout(id)} //использовали номерок
    
    block.addEventListener('mouseover', handler, false)
    block.addEventListener('mouseout', handler2, false)
  </script>
</body>

bot87 · #6 (**permalink**) 17.05.2012, 13:13

спасибо за отличную помощь.

Форум

Справочник

Discord чат

Курсы javascript