Всем привет. Суть вопроса такова, что есть меню на bootstrap и в нем есть пункт с выпадающим меню, который растягивается на весь экран. 
На данный момент я реализовал это, немного изменив стили для выпадающего меню, задав ему position fixed и растянул на всю ширину экрана. Все бы хорошо, но при скролле вниз меню остается на своей позиции.  Но и этот вопрос я решил с помощью jQuery, просто повешав событие на скролл,  эмулируя клик на родительский пункт для закрытия выпадающего меню.
Однако есть еще одна проблема, если пункт меню остается в зоне видимости экрана и кликнув на него , я снова вижу это меню с выпадением и верхним отступом.
Какие есть пути для реализации,  и вообще как принято верстать такие меню (не использую фреймворки). Просто первый раз сталкиваюсь и очень интересно узнать как это делают другие ? 
Спасибо.
пункт меню
 нормальное состояние
нормальное состояние
 ненужный верхний отступ при видимости родительского пункта
ненужный верхний отступ при видимости родительского пункта
