Вопрос с resize в браузере очень тонкий. Надо писать свой handler. Вот классический вариант подходящий для любых событий. Здесь представлено для resize
// отлавливает события resize
var handleResizeEvents = function() {
var resizeLayout = debounce(_resizeEvents, 30);
$(window).resize(resizeLayout);
}
// выполнятся через 30мс после resize
var _resizeEvents = function() {
// здесь функция ховера
if ($(window).width() > 767) {
$('.dropdown').hover(function() {
$('.dropdown-menu').css('display', 'block')
},
function() {
$('.dropdown-menu').css('display', 'none')
}
)
$('.li-sub-dropdown').hover(function() {
$('.sub-dropdown-menu').css('display', 'block')
},
function() {
$('.sub-dropdown-menu').css('display', 'none')
})
};
}
// Функционал следящий за событиями (взято из underscore.js)
// copyright undersore.js
var debounce = function(func, wait, immediate) {
var timeout, args, context, timestamp, result;
return function() {
context = this;
args = arguments;
timestamp = new Date();
var later = function() {
var last = (new Date()) - timestamp;
if (last < wait) {
timeout = setTimeout(later, wait - last);
} else {
timeout = null;
if (!immediate) result = func.apply(context, args);
}
};
var callNow = immediate && !timeout;
if (!timeout) {
timeout = setTimeout(later, wait);
}
if (callNow) result = func.apply(context, args);
return result;
};
};
А вот специальный плагин для этих целей.