在调整窗口大小时禁用jquery函数
我目前在wordpress网站上有以下代码。如果scrollTop小于导航栏的高度,scroll功能将隐藏购物车按钮。这样,在移动设备上,购物车按钮(固定在右上角)不会阻止折叠的菜单按钮。我希望在宽度大于1024px的窗口上禁用此功能,就像我尝试使用窗口大小调整功能一样在调整窗口大小时禁用jquery函数,jquery,Jquery,我目前在wordpress网站上有以下代码。如果scrollTop小于导航栏的高度,scroll功能将隐藏购物车按钮。这样,在移动设备上,购物车按钮(固定在右上角)不会阻止折叠的菜单按钮。我希望在宽度大于1024px的窗口上禁用此功能,就像我尝试使用窗口大小调整功能一样 jQuery(document).scroll(function() { var y = jQuery(this).scrollTop(); if (y > jQuery('.x-navbar-inner'
jQuery(document).scroll(function() {
var y = jQuery(this).scrollTop();
if (y > jQuery('.x-navbar-inner').height()) {
jQuery('.x-menu-item-woocommerce').fadeIn(1000);
} else {
jQuery('.x-menu-item-woocommerce').fadeOut(1000);
}
});
jQuery(window).resize(function(){
if (jQuery(window).width() >= 1024) {
jQuery('.x-menu-item-woocommerce').show();
}
});
我不确定如何才能让它工作。如图所示,我尝试将滚动功能环绕在窗口大小调整功能上,但是这不起作用
jQuery(window).resize(function(){
jQuery(document).scroll(function() {
var y = jQuery(this).scrollTop();
if (y > jQuery('.x-navbar-inner').height()) {
jQuery('.x-menu-item-woocommerce').fadeIn(1000);
} else {
jQuery('.x-menu-item-woocommerce').fadeOut(1000);
}
});
if (jQuery(window).width() >= 1024) {
jQuery('.x-menu-item-woocommerce').show();
}
});
您可以使用off()
删除侦听器
因为您可能希望再次实现它,所以将代码移动到处理程序函数是最干净的
在调整大小处理程序中打开/关闭卷轴,然后在页面加载时触发调整大小
function scroller(){
//your scroll stuff
}
jQuery(window).resize(function(){
if (jQuery(window).width() >= 1024) {
jQuery('.x-menu-item-woocommerce').show();
jQuery(window).off('scroll');
} else{
jQuery(window).scroll(scroller);
}
// trigger event on page load
}).resize();