Automagically squishes menus the minute they get too big for their boots
containerWidth: itemsWidth:
Actually it doesn't.
It just makes it easier for you to squish the menu when you need
to by alerting you to the fact the container is .too-small
.
What you decide to do with that information is up to you.
The script measures the width of each menu item to create an itemsWidth value and compares it to the containerWidth. I've included some basic styles to illustrate the point.
You can also have a second toggle button...
squishMenu(
{
containerId: "menu-1",
toggleClass: ".menu-1-toggle"
}
);
.list-item
elements inside the targetted container. This is
a naming convention from WordPress that is as good as any.
display:inline-block;
in their default state. Anything
fancypants like flexbox wont give you a usable measurement to compare to
the container.