0
165
Vistas¿Cómo agregar una barra de progreso animada a mi notificación?
Me gustaría que alguien me ayudara a poner una barra de progreso animada en colores debajo del [border-bottom: 3px solid #a3c846;] por ejemplo, ralentizando con el tiempo en la variable [timer], ¿alguien me puede ayudar? ¡Gracias!
$(document).ready(function(){ window.addEventListener("message",function(event){ var html = "<div id='"+event.data.css+"'>"+event["data"]["mensagem"]+"</div>" $(html).fadeIn(500).appendTo("#notifications").delay(event["data"]["timer"]).fadeOut(500); }) }); #sucesso { background: rgba(34,34,34,0.75) url("images/check.png") no-repeat center left 11px; border-bottom: 3px solid #a3c846; } <html> <head> <meta charset="UTF-8"> <title>#creative</title> <script src="nui://game/ui/jquery.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script> <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> <link rel="stylesheet" href="style.css"> </head> <body> <div id="notifications"> </div> <script src="app.js"></script> </body> </html>
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Prueba algo como
$(html).fadeIn(500).appendTo("#notifications") .animate({ width: '0%' }, event["data"]["timer"]);
·
Juan Pablo Isaza
Denunciar
Responde la pregunta