Sunday, June 2, 2024
 Popular · Latest · Hot · Upcoming
164
rated 0 times [  169] [ 5]  / answers: 1 / hits: 38274  / 13 Years ago, fri, june 3, 2011, 12:00:00

I want to display a dialog when a user mouses over a certain image. That part works. Unfortunately if the mouse even just passes over the corner of the image quickly it will display the dialog. I would like to have the dialog show only if the mouse is left over the image for one full second so as to avoid inadvertent pop ups.



I saw this question but it is for jQuery and I am using Prototype. I don't know enough jQuery to interpret that solution.



If someone could explain the logic or JavaScript functionality that will be required to cause a delayed firing of the mouseover event I would appreciate it.


More From » prototypejs

 Answers
2

You can't delay the firing of the event, but you can delay your handling of the event.



Here's a quick example without jQuery or Prototype that will make it easier to understand.



var delay = function (elem, callback) {
var timeout = null;
elem.onmouseover = function() {
// Set timeout to be a timer which will invoke callback after 1s
timeout = setTimeout(callback, 1000);
};

elem.onmouseout = function() {
// Clear any timers set to timeout
clearTimeout(timeout);
}
};


delay(document.getElementById('someelem'), function() {
alert(Fired);
});

[#91874] Thursday, June 2, 2011, 13 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
cadendericki

Total Points: 482
Total Questions: 109
Total Answers: 103

Location: Ecuador
Member since Thu, Jun 4, 2020
4 Years ago
cadendericki questions
Wed, Apr 7, 21, 00:00, 3 Years ago
Wed, Jul 8, 20, 00:00, 4 Years ago
Thu, May 14, 20, 00:00, 4 Years ago
;