2016-06-08 12 views
-3

Dieser Code funktioniert perfekt, aber ich brauche es, wenn ich meinen Browser öffne. Wenn ich die Größe meines Browsers ändere, um ein mobiles Menü zu haben, arbeiten beide Funktionen mit dem Mauszeiger.Benötigen Sie Hilfe zu diesem jQuery-Code?

$(window).on('resize', function(event) { 
    var windowWidth = $(window).width(); 
    if (windowWidth < 1024) { 
    $(document).ready(function() { 
     $(".menu-item-has-children").hover(function() { 
     $(".sub-menu").css("display", "block"); 
     }, function() { 
     $(".sub-menu").css("display", "none"); 
     }); 
    }); 
    } else if (windowWidth > 1024) { 
    jQuery(document).ready(function() { 
     $('.menu-item-has-children').click(function() { 
     $(this).find('.sub-menu').toggle(); 
     }); 
    }); 
    } 
}); 
+2

soll dieser Code ausgeführt werden, wenn Sie Ihren Browser ändern. Was genau funktioniert nicht und was hast du probiert? –

Antwort

1

Mein bester Ansatz wird den Code ersetzen mit:

var reszFn = function(event) { 
    var windowWidth = $(window).width(); 
    if (windowWidth < 1024) { 
    $(document).ready(function() { 
     $(".menu-item-has-children").hover(function() { 
     $(".sub-menu").css("display", "block"); 
     }, function() { 
     $(".sub-menu").css("display", "none"); 
     }); 
    }); 
    } else if (windowWidth > 1024) { 
    jQuery(document).ready(function() { 
     $('.menu-item-has-children').click(function() { 
     $(this).find('.sub-menu').toggle(); 
     }); 
    }); 
    } 
}; 
$(document).on('ready', reszFn); 
$(window).on('resize', reszFn); 
+0

Danke, aber wenn ich die Größe meines Browsers ändere, habe ich sowohl den Mauszeiger als auch den Mauszeiger und wenn ich unter 1024px Breite bin, möchte ich nur die Umschaltfunktion. –

+0

@ViktorPetkovski Sie sollten den 'docReady' Code nicht verwenden, da er nie ausgeführt wird, da Doc bereits fertig ist. Sie müssen '.off(). On()' in Erwägung ziehen. Entfernen Sie einfach die 'docReady' Zeilen. –

+0

Ich entferne DocReady Zeilen aber jetzt aber ist das gleiche. Können Sie den Code bitte bearbeiten, weil ich feststecke. :( –

0

einfach lösen die Formatfunktion

$(window).on('resize', function(event) { 
    var windowWidth = $(window).width(); 
    if (windowWidth < 1024) { 
    $(document).ready(function() { 
     $(".menu-item-has-children").hover(function() { 
     $(".sub-menu").css("display", "block"); 
     }, function() { 
     $(".sub-menu").css("display", "none"); 
     }); 
    }); 
    } else if (windowWidth > 1024) { 
    jQuery(document).ready(function() { 
     $('.menu-item-has-children').click(function() { 
     $(this).find('.sub-menu').toggle(); 
     }); 
    }); 
    } 
}).resize(); 
Verwandte Themen