0

Situation

  • I have a navbar on my website, and in it I own several dropdown menus / megamenus.
  • I need this dropdown is clicked when the user has the option to "roll" the page up and down with the arrow keys on the keyboard.
  • With the mouse wheel that already works
  • But the keyboard does not ... even if you set the focus (using. Focus () in jquery) on an element that is outside the navbar.
  • JSFiddle is here,resize the screen if the drop down does not appear..

Then try to push up and down on the keyboard, this case will not work (the screen will not go down or up) ... only works with the mouse wheel, and I need this to work with the keyboard also

And I've tried cases as

$(document).keyup(function(event) {
     if(event.keyCode == 38) { // up
     // do something
     } else if(event.keyCode == 40) { //down
     // do something
     }
});

OR

$('#menu').on('click', function(event) {
  $('body' or 'someelement').focus();
});

Sorry for my english.

j08691
  • 204,283
  • 31
  • 260
  • 272

1 Answers1

0

So folks, I ended up finding an answer.

Click here to see the final jsFiddle

I ended up capturing the onclick event of the menu.

Avoid the spread of this event.

And I end up controlling the opening and closing of the menu via code.

For this, I had to remove the data-toggle from the menu.

<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret">  </b></a>

Thanks for the help.