Я использую HeadroomJS (https://wicky.nillia.ms/headroom.js/), чтобы определить, когда положение прокрутки вверху или нет сверху.
В параметрах "onTop"
и "onNotTop"
, я объявил .on('click
event.
Когда пользователь не находится вверху страницы, и нажата menuTrigger
, оба $(menuTrigger).on('click touchstart', function (e) {
события продолжаются.
Как видно из кода, console.log('b2');
объявляется один раз в каждом параметре headroomjs, но в моей консоли он отображается дважды, что означает, что обе функции триггера меню работают.
// Construct headroom instance
headroom = new Headroom(primaryHeader, {
"onTop" : function() {
// Dynamically update the src="" of the brand-image using the data attributes of dark/light logo url's. Depending on the boolean value returned from the helper function. Checks if the 'primary-logo-color' attribute is "dark" or "light". Triggers only when scrolled to top.
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('a1');
} else {
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('a2');
}
$(menuTrigger).on('click touchstart', function (e) {
if ($(checkMenu).is(".primary-header.is-expanded")) {
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('b1');
} else {
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('b2');
}
} else {
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('c1');
} else {
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('c2');
}
}
// Prevent touch events from triggering click events and this process looping
e.preventDefault();
});
},
// Dynamically update the src="" of the brand-image using the data attributes of dark/light logo url's. Depending on the boolean value returned from the helper function. Checks if the 'primary-logo-color' attribute is "dark" or "light". Triggers only when not scrolled to top.
"onNotTop" : function() {
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('a1');
} else {
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('a2');
}
$(menuTrigger).on('click touchstart', function (e) {
if ($(checkMenu).is(".primary-header.is-expanded")) {
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('b1');
} else {
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('b2');
}
} else {
if ( primary_header_007_logo_color( primaryLogoColor ) ){
$('.primary-header__brand-image').attr("src", darkLogoSrc);
console.log('c1');
} else {
$('.primary-header__brand-image').attr("src", lightLogoSrc);
console.log('c2');
}
}
// Prevent touch events from triggering click events and this process looping
e.preventDefault();
});
},
});