Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Snackbar documentation doesn't include JS trigger instructions #238

Open
cweitat opened this issue Dec 19, 2019 · 2 comments
Open

Snackbar documentation doesn't include JS trigger instructions #238

cweitat opened this issue Dec 19, 2019 · 2 comments

Comments

@cweitat
Copy link

cweitat commented Dec 19, 2019

To add how to trigger snackbar with JS.
Adapted from docs.min.js. Code as such

//close snackbar on click
        $(".snackbar-btn").on("click", function () {
            $(this).parent(".snackbar").removeClass("show")
        });

//show snackbar on click and auto hide at either after 6000ms or button is click again to show new snackbar
        $(".snackbar-toggler").on("click", function () {
            var e = $(this).next(".snackbar");
            if ($(".snackbar.show").length > 0) {
                $(".snackbar.show").removeClass("show").one("webkitTransitionEnd transitionEnd", function () {
                    e.addClass(function () {
                        setTimeout(function () {
                            e.removeClass("show")
                        }, 6e3);
                        return "show"
                    })
                })
            } else {
                e.addClass(function () {
                    setTimeout(function () {
                        e.removeClass("show")
                    }, 6e3);
                    return "show"
                })
            }
        });
@sesemaya
Copy link
Contributor

sesemaya commented Jan 6, 2020

Hi @cweitat,

Those code were temporary hacks for demo purposes only.

We are upgrading Material to work with Bootstrap 4.4, and once done, toast should be triggered like https://getbootstrap.com/docs/4.4/components/toasts/#methods.

@djibe
Copy link

djibe commented May 8, 2020

Hi, no need for custom snackbars anymore, just use Bootstrap toasts.

https://djibe.github.io/material/docs/4.5/material/snackbars/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants