Ayúdame a cambiar el efecto de marca de agua del efecto de clic en el botón.

Primero, imprima el objeto de evento en la siguiente ubicación del código para verificar si se llama repetidamente:

Como resultado, haga clic en los botones "waves" y "btn" de arriba devuelve diferentes objetos de eventos, eliminando así la posibilidad de llamadas repetidas.

En la línea 129 del código, cambie el temporizador de la animación a un temporizador más grande (para reducir la velocidad de ejecución de la animación) y observe el efecto:

Después de la observación, fue Descubrí que el efecto de "ondulación del agua" es de pantalla completa. Después de hacer clic en un botón, puede ver ondas de agua en ambos botones, pero de hecho, esto se debe a que la capa de animación de la ondulación del agua es de pantalla completa y cubre toda la animación de la ondulación del agua. capa. La capa de animación cubre toda la página y, debido a que la capa de ondas de agua es blanca y translúcida, no puedes ver las áreas blancas de la página, pero puedes ver áreas de otros colores (puedes cambiar el color de fondo del sujeto a algo que no sea de color blanco y haga clic en el botón para probarlo).

Se ha encontrado la causa raíz y la solución también es muy simple. Simplemente haga que la generación de la capa de ondas de agua no exceda el área del botón actual. El método específico es: en la línea 20 de código. agregue .waves y .btn Dos líneas de código CSS: position:?relative;

overflow:?hidden