var nothover = function(){window.setTimeout(function() {
     $('#proFBfeel').hide();
      $('#proFBfeel .moreinfos').html('');
       $('.contact_pro').html('');
     },3000);
   };
  $('#proFBfeel').nothover();
    $('#proFBfeel').hover(function() {
        window.clearTimeOut(nothover);
     });
         $('html').click(function() {
           $('#proFBfeel').hide();
            $('#proFBfeel .moreinfos').html('');
             $('.contact_pro').html('');
          });

Ok so as you can see in what I assigned the var nothover is the setTimeout

After three seconds I want the function to run, UNLESS the object is hovered. And if it is hovered to clear the time out.

Then Once back outside of the object to run the function again or unless they click the HTML element which then hides the object.

This is not running properly though it says for me

Uncaught TypeError: Object [object Object] has no method 'nothover'

Why is this? And if someone can help I'd be greatly appreciate this. By Help I mean explain a little of the javascript functions and how I'd go about making sure these run properly.

Thank You

var nothover = function(){window.setTimeout(function() {
     $('#proFBfeel').hide();
      $('#proFBfeel .moreinfos').html('');
       $('.contact_pro').html('');
     },3000);
   };
  $('#proFBfeel').nothover();
    $('#proFBfeel').hover(function() {
        window.clearTimeOut(nothover);
     });
         $('html').click(function() {
           $('#proFBfeel').hide();
            $('#proFBfeel .moreinfos').html('');
             $('.contact_pro').html('');
          });

Ok so as you can see in what I assigned the var nothover is the setTimeout

After three seconds I want the function to run, UNLESS the object is hovered. And if it is hovered to clear the time out.

Then Once back outside of the object to run the function again or unless they click the HTML element which then hides the object.

This is not running properly though it says for me

Uncaught TypeError: Object [object Object] has no method 'nothover'

Why is this? And if someone can help I'd be greatly appreciate this. By Help I mean explain a little of the javascript functions and how I'd go about making sure these run properly.

Thank You

• javascript
• jquery
• settimeout

Share Follow asked Mar 4, 2013 at 2:45 EasyBBEasyBB 6,58499 gold badges5050 silver badges8181 bronze badges 1

• You're trying to invoke a global function nothover as a jQuery plugin... – natlee75 Commented Mar 4, 2013 at 2:52

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

setTimeout returns a value. If you want to "cancel" the timeout, you supply the value to clearTimeout. You don't pass your function to clearTimeout. That will not do anything. No one in this thread seems to have noticed that. Here is documentation on this: clearTimeout.

Here is working code:

var notHover = function() {
   var timerId = setTimeout(function () {
      $('#proFBfeel').hide();
      $('#proFBfeel .moreinfos').html('');
      $('.contact_pro').html('');  
    }, 3000);

    // return a function which will cancel the timer
    return function () { clearTimeout(timerId); };
};

// start the timer.  We can call cancelTimer() if we want to cancel it
var cancelTimer = notHover();

$('#proFBfeel').hover(function() {
    // mouse in, cancel the notHoverTimer
    if (cancelTimer) {
        cancelTimer();
        cancelTimer= undefined;
    }
}, function () {
    // mouse out, start the timer again
    cancelTimer = notHover();
});

```

To add a method to the jQuery object you have to do $.fn.nothover = function(){ ... What you have there is just an assignment of a function expression to a variable, which in no way will affect jQuery.

$.fn.nothover = function () {
    function hideIt() {
        this.hide();
        this.find(".moreinfos").html("");
    }
    this.hover(function () {
        window.clearTimeout(hideIt);
    });
    window.setTimeout(hideIt, 3000);
};

Is this along the lines of what you're trying to do...?

In this code I'm defining a jQuery plugin by defining a property on the $.fn object. Within this plugin I define a function hideIt which contains the code that you seem to want to invoke after the 3 seconds unless the user hovers over the element in question in which case we clear the 3 second timeout. Is that right?

Attempt #2

Maybe something like this...?

$.fn.nothover = function () {
    function initialize() {
        window.setTimeout(doSomething, 3000);
    }

    function doSomething() {
        // do something
    }

    this.hover(function () {
        window.clearTimeout(doSomething);
    }, initialize);

    initialize();
};

Closer?