El método script.aculo.us Effect.fade() se puede utilizar para desvanecerse del DOM. Effect.Fade () se puede usar con el método Effect.Appear() para desvanecer el contenido y luego volver a mostrarlo.
Sintaxis:
new Effect.Fade(id_of_element, [options]);
Este efecto no tiene parámetros específicos. Se pueden utilizar los parámetros comunes del módulo de efectos visuales.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="prototype.js">
</script>
<script type="text/javascript"
src="scriptaculous.js">
</script>
<script type="text/javascript">
function ShowElement(element) {
new Effect.Appear(element,
{ duration: 1 });
}
function HideElement(element) {
new Effect.Fade(element,
{ duration: 1, from: 1.0, to: 0 });
}
</script>
</head>
<body>
<div onclick="ShowElement('element')">
<Button>Show Content</Button>
</div>
<br />
<div onclick="HideElement('element')">
<Button>Hide Content</Button>
</div>
<br />
<img id="element" src="GEEKSIMAGES/gfg.png">
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por swapnil074 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA