我无法让它工作,所以很明显我做错了...我在菜单的子菜单上创建了一个淡入淡出状态,这很好用,但是当我缩小到移动视图时效果仍然相关,我不希望因为移动设备没有悬停状态。所以我在jquery(窗口).resize函数中敲击了我的函数,但它根本不起作用。
jQuery(window).resize(function() {
var w = jQuery(window).width();
if (w <= 768 ) {
jQuery('nav.main-nav li').each(function() {
var submenu = jQuery(this).find('ul:first');
jQuery(this).hover(function() {
submenu.css({opacity: 1});
submenu.stop().css({overflow:'hidden', height:'auto', display:'none'}).fadeIn(300, function() {
jQuery(this).css({overflow:'visible', height:'auto', display: 'block'});
});
},
function() {
submenu.stop().css({overflow:'hidden', height:'auto', display:'none'}).fadeOut(300, function() {
jQuery(this).css({overflow:'hidden', display:'none'});
});
});
});
}
});
答案 0 :(得分:2)
而不是使用jQuery(window).width();
,
尝试使用document.documentElement.clientWidth