Anonymous
JQuery Click -Event funktioniert nicht in den mobilen Browsern und Google Chrome
Post
by Anonymous » 22 Mar 2025, 03:38
Ich habe einen JQuery -Code, um das Dropdown -Menü für Mobile zu verarbeiten. Es funktioniert gut auf dem Firefox, aber nicht in Chrome und Mobile. Ich weiß nicht warum. Siehe meinen Screenshot.
Code: Select all
jQuery(document).ready(function(){
jQuery(".menu-toggle").click(function(){
if(jQuery(this).hasClass("open")){
jQuery(this).removeClass("open");
jQuery("body").removeClass("navigation-open");
jQuery("#menu-main-menu-mobile").children("li").hide();
}else{
jQuery(this).addClass("open");
jQuery("body").addClass("navigation-open");
jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
jQuery(this).delay(100 * i).fadeIn(500);
});
}
});
jQuery("#menu-main-menu-mobile").children("li.menu-item-has-children").each(function(){
var thismn = jQuery(this);
thismn.children("a").on("click", function(e){
e.preventDefault();
jQuery("#navigation").find(".sub-menu.open").removeClass("open");
thismn.children(".sub-menu").addClass("open");
jQuery(".scwmobilemenu_head").html('[i][/i] Back');
thismn.parent("ul").addClass("opensubmenu opensubmenu_level1");
jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
jQuery(this).children("a").delay(100 * i).animate({
left: -50,
opacity: 0
}, 500);
});
thismn.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) {
jQuery(this).delay(200 * i).fadeIn(1000);
});
});
thismn.find("li.menu-item-has-children").each(function(){
var thismnlv2 = jQuery(this);
thismnlv2.children("a").click(function(e){
e.preventDefault();
thismnlv2.children(".sub-menu").addClass("open");
thismnlv2.parent("ul").addClass("opensubmenu opensubmenu_level2");
jQuery(".opensubmenu_level2").children("li").each(function(i) {
jQuery(this).children("a").delay(100 * i).animate({
left: -50,
opacity: 0
}, 500);
});
thismnlv2.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) {
jQuery(this).delay(200 * i).fadeIn(1000);
});
});
});
});
jQuery(".scwmobilemenu_head").click(function(){
if(jQuery(".opensubmenu").length > 1){
jQuery(".opensubmenu_level2").find(".sub-menu.open").children("li").fadeOut();
jQuery(".opensubmenu_level2").children("li").each(function(i) {
jQuery(this).children("a").delay(100 * i).animate({
left: 0,
opacity: 1
}, 500);
});
jQuery(".opensubmenu_level2").find(".sub-menu.open").removeClass("open");
jQuery(".opensubmenu_level2").removeClass("opensubmenu").removeClass("opensubmenu_level2");
}else{
jQuery(".opensubmenu_level1").find(".sub-menu.open").children("li").fadeOut();
jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
jQuery(this).children("a").delay(100 * i).animate({
left: 0,
opacity: 1
}, 500);
});
jQuery(".opensubmenu_level1").find(".sub-menu.open").removeClass("open");
jQuery(".opensubmenu_level1").removeClass("open").removeClass("opensubmenu").removeClass("opensubmenu_level1");
jQuery(this).html('Menu');
}
});
});
Bitte helfen Sie, danke
1742611114
Anonymous
Ich habe einen JQuery -Code, um das Dropdown -Menü für Mobile zu verarbeiten. Es funktioniert gut auf dem Firefox, aber nicht in Chrome und Mobile. Ich weiß nicht warum. Siehe meinen Screenshot.[code]jQuery(document).ready(function(){ jQuery(".menu-toggle").click(function(){ if(jQuery(this).hasClass("open")){ jQuery(this).removeClass("open"); jQuery("body").removeClass("navigation-open"); jQuery("#menu-main-menu-mobile").children("li").hide(); }else{ jQuery(this).addClass("open"); jQuery("body").addClass("navigation-open"); jQuery("#menu-main-menu-mobile").children("li").each(function(i) { jQuery(this).delay(100 * i).fadeIn(500); }); } }); jQuery("#menu-main-menu-mobile").children("li.menu-item-has-children").each(function(){ var thismn = jQuery(this); thismn.children("a").on("click", function(e){ e.preventDefault(); jQuery("#navigation").find(".sub-menu.open").removeClass("open"); thismn.children(".sub-menu").addClass("open"); jQuery(".scwmobilemenu_head").html('[i][/i] Back'); thismn.parent("ul").addClass("opensubmenu opensubmenu_level1"); jQuery("#menu-main-menu-mobile").children("li").each(function(i) { jQuery(this).children("a").delay(100 * i).animate({ left: -50, opacity: 0 }, 500); }); thismn.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) { jQuery(this).delay(200 * i).fadeIn(1000); }); }); thismn.find("li.menu-item-has-children").each(function(){ var thismnlv2 = jQuery(this); thismnlv2.children("a").click(function(e){ e.preventDefault(); thismnlv2.children(".sub-menu").addClass("open"); thismnlv2.parent("ul").addClass("opensubmenu opensubmenu_level2"); jQuery(".opensubmenu_level2").children("li").each(function(i) { jQuery(this).children("a").delay(100 * i).animate({ left: -50, opacity: 0 }, 500); }); thismnlv2.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) { jQuery(this).delay(200 * i).fadeIn(1000); }); }); }); }); jQuery(".scwmobilemenu_head").click(function(){ if(jQuery(".opensubmenu").length > 1){ jQuery(".opensubmenu_level2").find(".sub-menu.open").children("li").fadeOut(); jQuery(".opensubmenu_level2").children("li").each(function(i) { jQuery(this).children("a").delay(100 * i).animate({ left: 0, opacity: 1 }, 500); }); jQuery(".opensubmenu_level2").find(".sub-menu.open").removeClass("open"); jQuery(".opensubmenu_level2").removeClass("opensubmenu").removeClass("opensubmenu_level2"); }else{ jQuery(".opensubmenu_level1").find(".sub-menu.open").children("li").fadeOut(); jQuery("#menu-main-menu-mobile").children("li").each(function(i) { jQuery(this).children("a").delay(100 * i).animate({ left: 0, opacity: 1 }, 500); }); jQuery(".opensubmenu_level1").find(".sub-menu.open").removeClass("open"); jQuery(".opensubmenu_level1").removeClass("open").removeClass("opensubmenu").removeClass("opensubmenu_level1"); jQuery(this).html('Menu'); } }); }); [/code] Bitte helfen Sie, danke