Update responsive function to not have to be in #navigation

[Dad.]

Hi there,

Currently, the responsive navigation functions ( updateVisibleNavigationLinks() and updateVisibleNavigationTabs() ) require public and private tabs to be in the #navigation div. Furthermore, it asks them to be siblings for it to work smoothly. To make a long story short, if you wanted to break up private and public tabs into two areas, you have to literally move the HTML as responsive positioning is extremely buggy and absolute positioning breaks the function (as absolute elements never overflow Im guessing) and also remove the publicTabs (and/or privateTabs) class name.

The solution would be to just completely remove the:

$('#navigation').find(...);

And just make it something like $('.blockLinksList') for the updateVisibleNavigationLinks() and then run for each instance. This would allow you to move the public and private tabs wherever you want and still check for overflow. As it stands now, all skins have to have these two items on the same line unless they want to go through the trouble of copying the entire function and function call code and rewrite it to do what I just said.

Its a small change that would make customizing the navigation area MUCH easier. Feel free to ask questions on this, as I haven't worded it the best.

Thanks,
Mike

 

[Dad.]

To make this a bit clearer, the function should work on any unordered list. Thus footer menus, the moderator bar, even tabs if someone wanted, or whatever else, could be responsive. You've already written the code, you just need to make the function possible to work on any unordered list either by giving it a class that the javascript function looks for or by calling a function on that selector.

In summary the problem is that it ONLY works on #navigation. And with a few tweaks it could work anywhere.

 

[Dad.]

And to add one more thing: Moderator Bars -- they are getting more and more tools and links. Admin, Moderation, Reports, Users, Login as User, and other moderator tools. This NEEDS the responsive function now. Developers are using this area and XenForo needs to have ALL lists at least able to use the function just by adding a class.

<div id="moderatorBar><ul class="responsiveList">..
<div class="footer><ul class="responsiveList">..
<div id="navigation><ul class="responsiveList">..
<div class="tabLinks><ul class="responsiveList">..
etc.