• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
    • Questions
    • Teachers
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

155
Views
Parpadeando el color de fondo <button>

Estoy tratando de hacer que la animación funcione: básicamente hay un cuadro desplegable y un botón Cuando un usuario hace una nueva selección del menú desplegable, el color de fondo del botón cambiará en consecuencia. Esta parte funciona. Sin embargo, me gustaría agregar un efecto de animación que cada vez que se haga una nueva selección en el menú desplegable, el color de fondo del color cambiará en consecuencia y parpadeará 3 veces. La razón es que esta animación mostrará que se acepta y maneja la nueva selección.

Estoy usando un script de tipo Angular.

Aquí está la lista desplegable para que el usuario seleccione una opción

 <mat-select> <mat-option (onSelectionChange)="setButtonColor($event)" *ngFor="let opt of Opts" [value]="Opts"> {{ opt }} </mat-option> </mat-select>

Así es como se crea el botón en el html

 <button mat-raised-button class="mt-status-button" [ngStyle]="{'background-color': bgColor[0], 'color': 'white', 'width': '120px', 'margin': '10px 5px 5px 50px'}"> item1 </button>

Aquí está el setButtonColor activado por la nueva selección de opciones y cambiará el color de fondo del botón (cambiando los valores de bgColor[0] ) y, con suerte, el color de fondo recién cambiado parpadeará

En este momento, el cambio de color es exitoso, pero no puedo hacer que parpadee al seleccionar la lista desplegable.

 setButtonColor(event) { if (event.isUserInput) { var colorStr:string; <==== Is there a way to trigger button background color flash for 3 times in here?
almost 3 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error