javascript - squarespace Navigation collapsing to hamburger -


i have bilingual site , in order keep ability have dropdowns in navigation have written jquery code. start links both languages in nav bar , jquery code hides links don't belong language of page being rendered. however, seems bedford template using check see length of nav bar before hide links , forces navbar hamburger menu. wondering:

  1. if there way trigger function measuring nav bar length after hide other language's links template render mainnavigation. have put jquery code header section of code injection template page rendering code seems occur first.
  2. if not, can enable wrapping on nav bar doesn't cause collapse hamburger?
  3. can disable hamburger nav desktop sized screens , have media query turn on mobile screens? tried hiding hamburger nav happened navigation disappeared completely.

as stopgap tried shortening of nav names pages , removed couple of pages combined length allows template function work on large monitor, prove code works designed. however, problem reemerges when monitor size shrinks.

if helps, here how trying modify nav bar:

  1. i have added suffix each url-stub identifying language (-en english, -fr french).
  2. i add of pages in both languages main navigation.
  3. i have added following code page header code injection on each page, code extracts suffix. if current page english, uses jquery hide of french nav links. change suffixes "en" french pages.
$( function(){     $( "#mainnavigation > div.collection").each(function() {         var urlstub = $(this).find("a:first").attr("href");         if (urlstub.substr(urlstub.length-3,2) === "fr" ) {             $(this).hide();         }     })     $( "#mainnavigation > div.folder").each(function() {         var urlstub1 = $(this).find(".folder-toggle:first").attr("data-href");         if ( urlstub1.substr(urlstub1.length-3,2) === "fr" ) {             $(this).hide();         }     })     $( "#mobilenavigation > div.collection").each(function() {         var urlstub = $(this).find("a:first").attr("href");         if (urlstub.substr(urlstub.length-3,2) === "fr" ) {             $(this).hide();         }     })     $( "#mobilenavigation > div.folder").each(function() {         var urlstub1 = $(this).find(".folder-toggle:first").attr("data-href");         if ( urlstub1.substr(urlstub1.length-3,2) === "fr" ) {             $(this).hide();         }     }) }); 


Comments