Почему $(window).width() не совпадает с шириной заданной через css с помощью медиа-запроса?

Question

[Дмитрий]

После сужения окна браузера до 750 пикселей на пункты меню вешается событие .click(). Одновременно после того как окно браузера стало меньше 750 пикселей само меню меняется. Подпункты прячутся и остаются основные пункты. Собственно клик делает их видимыми по очереди. Проблема в том что Событие вешается немного раньше чем меню уменьшается. То есть примерно за 27 пикселей до скрытия подпунктов основные пункты имеют на себе событие клик. Я так понимаю что проблема в ширине полосы прокрутки которую браузер учитывает или нет при расчете ширины окна браузера. Причем в разных браузерах это происходит по разному. Как решение думаю сделать адаптивную верстку ТОЛЬКО для этого меню с помощью jQuery. Потому что подгонять под каждый браузер точку перехода мне кажется немного сложнее. Что скажете?

Answer 1

[Oblacko]

window.innerWidth должно подойти

Answer 2

[Сергей Жубартович]

А что если смотреть не на $(window).width(), а на $(menu).width()

Answer 3

[Дмитрий Кравченко]

советую либу Unison.js, с ней такие вещи делаются четко, она ориентируется не на ширину экрана, а на css, прописанный для элементов типа title