En este artículo, veremos cómo deshabilitar el efecto de animación usando jQuery. Para deshabilitar el efecto de animación, usamos la propiedad jQuery.fx.off .
La propiedad jQuery.fx.off se usa para habilitar/deshabilitar globalmente todas las animaciones de una página. Su valor predeterminado es falso, que se utiliza para permitir que la animación se ejecute con normalidad.
Sintaxis:
jQuery.fx.off = true|false;
Valores de propiedad:
- true: se usa para especificar que las animaciones deben estar deshabilitadas.
- falso: se usa para especificar que las animaciones deben estar habilitadas.
Enfoque: aquí, primero usaremos el elemento div para crear un cuadro cuadrado de tamaño 100px. Después de crear el cuadro, usamos el método toggle() para configurar la animación de alternar en el elemento <div> . Además, usamos la propiedad jQuery.fx.off para deshabilitar el efecto de alternar animación.
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<title>
How to disable jQuery animation?
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<style>
.box {
background: green;
height: 100px;
width: 100px;
margin: 50px;
}
</style>
</head>
<body>
<center>
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>Disable jQuery Animation</h2>
<button id="disable">
Disable the Animation
</button>
<button id="toggle">
Toggle Animation
</button>
<div class="box"></div>
<script>
$(document).ready(function() {
$("#disable").click(function() {
jQuery.fx.off = true;
});
$("#toggle").click(function() {
$("div").toggle("slow");
});
});
</script>
</center>
</body>
</html>
Producción:
