0
Welcome Guest! Login
0 items Join Now

Add a delay to dropdown menu hiding

    • Jordan W's Avatar
    • Jordan W
    • Sr. Rocketeer
    • Posts: 111
    • Thanks: 2

    Add a delay to dropdown menu hiding

    Posted 6 years 8 months ago
    • Hello,

      When hovering over a Gantry5 dropdown menu, the dropdowns disappear immediately after hovering over them has stopped. This makes it difficult to navigate to submenus for many users.

      Is it possible to add a delay after the hover even to keep the submenu visible?

      Jordan
    • Damir's Avatar
    • Damir
    • Preeminent Rocketeer
    • Posts: 22450
    • Thanks: 2679
    • Web Developer

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 8 months ago
    • Jordan W's Avatar
    • Jordan W
    • Sr. Rocketeer
    • Posts: 111
    • Thanks: 2

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 8 months ago
    • Frontend main navigation dropdwon
    • Jordan W's Avatar
    • Jordan W
    • Sr. Rocketeer
    • Posts: 111
    • Thanks: 2

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 8 months ago
    • Any help here?

      Paying customer asking.
    • Damir's Avatar
    • Damir
    • Preeminent Rocketeer
    • Posts: 22450
    • Thanks: 2679
    • Web Developer

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 8 months ago
    • Jordan W's Avatar
    • Jordan W
    • Sr. Rocketeer
    • Posts: 111
    • Thanks: 2

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 7 months ago
    • For those interested in doing this, it adds a very useful small delay to drop-downs that helps usability esepcially when operating menus with dropdowns (even more when more than 1 sub-menu level present).

      Go to:

      (your-site)/media/gantry5/assets/js/main.js

      Look for the mouseleave function:
      mouseleave: function(t) {
      var e = r(t.target);
      e.parent(this.options.selectors.mainContainer) && (e.parent(this.options.selectors.item) && !e.parent(".g-standard") || this.closeDropdown(e))
      }

      Change to:
      mouseleave: function(t) {
          var that = this;
      var e = r(t.target);
      setTimeout(function()
      {
      that.closeDropdown(e);
      },500);
      }

      You can change the 500 (in ms) to any number that suits you. A short delay makes a big difference.

      Jordan
    • Last Edit: 6 years 7 months ago by Jordan W.
    • Damir's Avatar
    • Damir
    • Preeminent Rocketeer
    • Posts: 22450
    • Thanks: 2679
    • Web Developer

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 7 months ago
    • Jordan W's Avatar
    • Jordan W
    • Sr. Rocketeer
    • Posts: 111
    • Thanks: 2

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 7 months ago
    • Is that a serious question?
    • Damir's Avatar
    • Damir
    • Preeminent Rocketeer
    • Posts: 22450
    • Thanks: 2679
    • Web Developer

    Re: Add a delay to dropdown menu hiding

    Posted 6 years 7 months ago

Time to create page: 0.048 seconds