Browse Source

nested menus: ensure title width is wide enough to accommodate children; fixes #54

Dean Attali 2 years ago
parent
commit
9e017d9fc0
1 changed files with 28 additions and 1 deletions
  1. 28
    1
      js/main.js

+ 28
- 1
js/main.js View File

@@ -35,6 +35,33 @@ var main = {
35 35
       });
36 36
     });
37 37
     
38
+    // Ensure nested navbar menus are not longer than the menu header
39
+    var menus = $(".navlinks-container");
40
+    if (menus.length > 0) {
41
+      var navbar = $("#main-navbar ul");
42
+      var fakeMenuHtml = "<li class='fake-menu' style='display:none;'><a></a></li>";
43
+      navbar.append(fakeMenuHtml);
44
+      var fakeMenu = $(".fake-menu");
45
+
46
+      $.each(menus, function(i) {
47
+        var parent = $(menus[i]).find(".navlinks-parent");
48
+        var children = $(menus[i]).find(".navlinks-children a");
49
+        var words = [];
50
+        $.each(children, function(idx, el) { words = words.concat($(el).text().trim().split(/\s+/)); });
51
+        var maxwidth = 0;
52
+        $.each(words, function(id, word) {
53
+          fakeMenu.html("<a>" + word + "</a>");
54
+          var width =  fakeMenu.width();
55
+          if (width > maxwidth) {
56
+            maxwidth = width;
57
+          }
58
+        });
59
+        $(menus[i]).css('min-width', maxwidth + 'px')
60
+      });
61
+
62
+      fakeMenu.remove();
63
+    }        
64
+    
38 65
     // show the big header image	
39 66
     main.initImgs();
40 67
   },
@@ -108,4 +135,4 @@ var main = {
108 135
 
109 136
 // 2fc73a3a967e97599c9763d05e564189
110 137
 
111
-document.addEventListener('DOMContentLoaded', main.init);
138
+document.addEventListener('DOMContentLoaded', main.init);

Loading…
Cancel
Save