Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   как узнать что курсор наведен на элемент (https://javascript.ru/forum/events/28379-kak-uznat-chto-kursor-naveden-na-ehlement.html)

Грабовский 17.05.2012 11:45

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

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


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

GuardCat 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 не знаю, прошу прощения. Возможно сможете сделать по аналогии.

Грабовский 17.05.2012 12:24

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

bot87 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 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 17.05.2012 13:13

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


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