Response title
This is preview!
jQuery special event hoverintent isn’t working properly with `mouseleave` functions
in Using jQuery
•
10 years ago
I'm having difficulty getting the `jQuery` special event `hoverintent` to work with `mouseleave` functions. *(I’ve also tried substituting `mouseout` for `mouseleave`)*
I need to utilize the same functionality so that the `mouseleave` event is only fired when the user's mouse has slowed down beneath the sensitivity threshold.
I’ve included the script below, and have also uploaded a working example to http://click2fit.com/test_files/accordion_hoverintent.html
I need to utilize the same functionality so that the `mouseleave` event is only fired when the user's mouse has slowed down beneath the sensitivity threshold.
I’ve included the script below, and have also uploaded a working example to http://click2fit.com/test_files/accordion_hoverintent.html
- $(function () {
- $(".accordion_close_leave").accordion({
- event: "click hoverintent",
- collapsible: true,
- active: false,
- autoHeight: false,
- }).mouseleave(function() {
- $(this).accordion({ active: false});
- });
- var cfg = ($.hoverintent = {
- sensitivity: 100,
- interval: 500
- });
- $.event.special.hoverintent = {
- setup: function() {
- $( this ).bind( "mouseover", jQuery.event.special.hoverintent.handler );
- },
- teardown: function() {
- $( this ).unbind( "mouseover", jQuery.event.special.hoverintent.handler );
- },
- handler: function( event ) {
- var that = this,
- args = arguments,
- target = $( event.target ),
- cX, cY, pX, pY;
- function track( event ) {
- cX = event.pageX;
- cY = event.pageY;
- };
- pX = event.pageX;
- pY = event.pageY;
- function clear() {
- target
- .unbind( "mousemove", track )
- .unbind( "mouseout", arguments.callee );
- clearTimeout( timeout );
- }
- function handler() {
- if ( ( Math.abs( pX - cX ) + Math.abs( pY - cY ) ) < cfg.sensitivity ) {
- clear();
- event.type = "hoverintent";
- event.originalEvent = {};
- jQuery.event.handle.apply( that, args );
- } else {
- pX = cX;
- pY = cY;
- timeout = setTimeout( handler, cfg.interval );
- }
- }
- var timeout = setTimeout( handler, cfg.interval );
- target.mousemove( track ).mouseout( clear );
- return true;
- }
- };
1
). Would you be able to show me how to combine the two?