FAB mobile improvements - active timeout & auto-tooltips

[dcworldwide]

On mobile, i think the fab menu should:

auto-collapse children after a fixed timeout period. i.e. 3 seconds. This means the user avoids having to click somewhere else on the page (which in my app, creates issues as it triggers events on other components to fire).

We should have the option to auto-display tooltips on fab menu children items. This is because there is no hover event on mobile.

thanks

[mazzie14]

+1

[cskiwi]

Any progress on this? could really use it :)

[cstamant]

Any updates?

[cstamant]

I may have a fix for this, if anyone is interested I can put it in a codepen and post it. It's a bit of a hack job but it does the trick.

[judasane]

Please re-open this. In mobile there is not a hover event.

[cstamant]

It is open...

[cstamant]

http://codepen.io/cstamant/pen/vORzMm

[romant]

thanks for putting that together @cstamant !

[philipraets]

I have created a different implementation which only requires css and tootlips are clickable: basically i use a-tags for the tooltips and style them, advantages are that the tooltips are clickable so you can apply the same action to it, and they have the same animation.

codepen:

http://codepen.io/anon/pen/rxMXob

[cstamant]

@philipraets, that's a great solution! @Dogfalo you should implement that.

[davidbielik]

This works well for me:

.fixed-action-btn ul > li > span {
    position: absolute;
    right: 100%;
    white-space: nowrap;
    background: rgba(0,0,0,.6);
    padding: 3px 9px;
    color: white;
    margin-top: 4px;
}

<div class="fixed-action-btn click-to-toggle" style="bottom: 45px; right: 24px;">
    <a class="btn-floating btn-large blue lighten-2">
        <i class="large fa fa-bars"></i>
    </a>
    <ul>
        <li>
            <span>I am text</span>
            <a class="btn-floating green">+</a>
        </li>
    </ul>
</div>

[judasane]

The solution from @davidbielik works great but only with vertical default buttons. Thank you.

Anyway, it's a shame it doesn't exist a default option for this.