Resource icon

Change popup menu delay

Jake Bunce

XenForo moderator
Staff member
Jake Bunce submitted a new resource:

Change popup menu delay (version 1.x) - Javascript edit to change delay for the popup menu when mousing over a nav tab or other menu.

This will change the delay for popup menus in the navbar. For example:

View attachment 29019

Edit this file:

js/xenforo/xenforo.js

Change the number in red:

Rich (BB code):
XenForo.PopupMenu.prototype={__construct:function(a){this.$container=a;this.$menu=this.$container.find(".Menu").appendTo("body");this.menuVisible=!1;if(!this.$menu.length)return console.warn("Unable to find menu for Popup...
Read more about this resource...
 
B

bogus

Guest
Thanks for that. Nice feature ;)
I see you know js so i would like to ask if its possible to add something that will close the popup after mouse is leaving the popup menu.
Right now you need to click somewhere else to get the menu popup closed?!
Thanks a lot
 

Jake Bunce

XenForo moderator
Staff member
I see you know js so i would like to ask if its possible to add something that will close the popup after mouse is leaving the popup menu.
Not really. I only have a fumbling knowledge of js right now. I am learning but I don't know how to do this off hand. Probably need the onmouseout event, though I'm not sure how to tie that into the existing js.
 

CyberAP

Well-known member
It was done because I wanted to include this right in the style, so user doesn't have to edit any xenforo files.
 

QenTox

Well-known member
I changed that to 20 and that just seems the right value for me. Thanks Jake for this useful tip!
 

adwade

Well-known member
Is this Code Modification still valid, with XF 1.5+? I ask because I tried revising it (i.e. up to 5000) and couldn't tell any difference. :confused:
 

adwade

Well-known member
Well I was asking since it doesn't seem to work for me and I noticed this depreciation statement in the xenforo.js file…
Code:
A=function(t){return"string"!=typeof t||e.event.special.hover?t:(H.test(t)&&r("'hover' pseudo-event is deprecated, use 'mouseenter mouseleave'"),t&&t.replace(H,"mouseenter$1 mouseleave$1"))};e.event.props&&"attrChange"!
So I was wondering if this code (just under the hoverIntent r5 section of the file) was what now controlled the delay instead…?
Code:
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}
 
Last edited:

Jake Bunce

XenForo moderator
Staff member
Well I was asking since it doesn't seem to work for me and I noticed this depreciation statement in the xenforo.js file…
Code:
A=function(t){return"string"!=typeof t||e.event.special.hover?t:(H.test(t)&&r("'hover' pseudo-event is deprecated, use 'mouseenter mouseleave'"),t&&t.replace(H,"mouseenter$1 mouseleave$1"))};e.event.props&&"attrChange"!
So I was wondering if this code (just under the hoverIntent r5 section of the file) was what now controlled the delay instead…?
Code:
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}
It should work. Be sure to do a hard refresh of the page (or restart your browser) to get the latest js after applying the modification.
 

Britney

Member
It does not work for me to just change to 0.
I've tried Edge, Chrome etc and also removed cache. Anyone got a fix?
 
Top