Automatically open tab in switcher with hash

[PixelT]

<ul>
<li id="section-1">red</li>
<li id="section-2">blue</li>
<li id="section-3">green</li>
</ul>

url/#section-2 automatically set this li (2) as active and display blue content
url/#section-3 automatically set this li (3) as active and display green content

[jerry1970]

+1! I've seen this in a few other projects and yes, that would be nice.

In my projects I've only needed this to set the tab when a user reloads the page so had a simple workaround by storing the active page in the localstorage.

[aheinze]

I think it is the best approach for now to implement this functionality yourself. there are too many cases where you can't use the location hash as an identifier (hash based routing etc).

[jerry1970]

The hash has become a bit abused for different things. I didn't like the way hash based routing made the anchor ability useless. But we have to deal with it. So although a hash in the URL would be most logical thing to do (ie. open the page at the anchor), I now agree with @aheinze that you should try and do it differently.

[mikerockett]

I'm in need of this too, for a sign in form with a Help tab that needs to be active at load-time when #help is the window hash. Not sure exactly how to do it, though. Do I need to trigger click.uikit.switcher? If so, how exactly do I do that?

Edit: I have this, so far. However, I can't switch back to the first tab.

UIkit.switcher($('[data-uk-switcher]')).show($('li#help'));

This is the markup:

<ul class="uk-tab" data-uk-switcher="{connect:'#tabs'}">
    <li id="session" class="uk-active"><a href="">New Session</a></li>
    <li id="help"><a href="">Help</a></li>
</ul>

<ul id="tabs" class="uk-switcher">
    <li id="session">...</li>
    <li id="help">...</li>
</ul>

[Intiligent]

http://stackoverflow.com/questions/35255031/uikit-set-switcher-tab-to-current-window-hash/38812645#38812645 - my answer
http://codepen.io/Intiligent/pen/RRqwAZ - example