Mensaje de alerta / notificación TEMPORAL con CSS y JQuery

HTML
Actualiza la página para ver los resultados...
CSS
body{
    font-family:arial;
}
.container-notification{
    position:absolute;
    bottom:3rem;
    left:50%;
    transform:translate(-50%);
    
    
    background:#34495e;
    border:2px solid #85929e;
    padding:1rem;
    color:#fff;
    border-radius:1rem;
    padding:1rem;
}
JS
function notific(msj){
    
    var str =''+
        '<div class="container-notification" id="containerNotification">'+
            msj + 
        '</div>'
        ;
    
    $("body").append(str);

}

$(function(){

    var msj = 'ERROR ,no se puede almacenar los datos.';
    
    notific(msj);

    setTimeout(function(){
        $("#containerNotification").fadeOut(500,function(){
            $(this).remove();
        });
    },4000);
    
});

Autor: Compositu

Publicado: 12/07/2020

Compartir Elemento Web

Donar a Compositu
Otras formas de ayudar
  • Compártelo en tus redes sociales.
  • Recomienda los elementos.
  • Regístrate Aquí
  • Deja tu comentario agradeciendo el aporte.

Descarga el código completo del Elemento Web y archivos necesarios (imágenes, librerias, plugins, frameword, etc)

Deja tu comentario