Toast

Los Toast son mensajes de alerta que aparecen en la pantalla y desaparecen al cabo de un tiempo
Simplemente creando un script el toast aparecera al cargar la pagina

<script>
    M.toast({
        html: 'Ha cargado la pagina',
        displayLength: 2000,
        classes: "blue"
    })
</script>

Para hacerlo aparecer al pulsar un boton lo vinculamos a un evento onclick del ancla.

Toast

<a class="btn" onclick="M.toast({html: 'Toast desde el boton', classes:'red'})">Toast</a>

Tambien podemos envolver el Toast del script en una funcion y ejecutarla desde el boton

Toast

<a class="btn" onclick="alerta()">Toast</a>
<script>
    function alerta() {
        M.toast({
            html: 'Toast envuelto en una funcion',
            displayLength: 2000,
            classes: "green",
            completeCallback: function () {
                alert('El Toast ha desaparecido')
            }
        })
    }
</script>

Opciones

Name	Type	Default	Description
html	String	''	El contenido html del Toast.
displayLength	Number	4000	Duracion en ms antes de desaparecer.
inDuration	Number	300	Duracion de la transicion de entrada en ms.
outDuration	Number	375	Duracion de la transicion de salida en ms.
classes	String	''	Clases que se agregaran al elemento Toast.
completeCallback	Function	null	Funcion de devolucion llamada cuando desaparece el Toast.
activationPercent	Number	0.8	El porcentaje del ancho del Toast para hacer desaparecer el Toast arrastrandolo.

Toast
Opciones