Diferencia entre revisiones de «Usuario:ManuelRomero/JavaScript/jquery/efectos»
De WikiEducator
< Usuario:ManuelRomero | JavaScript | jquery
(→Mostrar/Ocultar) |
|||
| Línea 63: | Línea 63: | ||
{{Actividad| | {{Actividad| | ||
Modifica el ejercico anterior para que se realice en un tiempo y que luego se muestre un alert diciendo que la imagen se ha mostrado u ocultado}} | Modifica el ejercico anterior para que se realice en un tiempo y que luego se muestre un alert diciendo que la imagen se ha mostrado u ocultado}} | ||
| − | + | ===devaneciéndose o degradaciones : fade==== | |
| − | + | ====Modo presentación : slide==== | |
| − | + | ====animimaciones: animate y stop==== | |
| − | + | ====Anidando acciones==== | |
| − | + | ====Concepto de funciones de callback==== | |
| − | + | ||
| − | + | ||
jQuery Callback | jQuery Callback | ||
jQuery Chaining | jQuery Chaining | ||
=== | === | ||
Revisión de 23:51 6 abr 2016
LENGUAJE JAVASCRIPT: JavaScript un lenguaje de programación web
Contenido
Programación web al lado del cliente
JavaScript Un lenguaje de script en el cliente
- Los efectos son acciones que queremos realizar sobre un elemento seleccionado
- La sintaxis sigue la básica de jquery
$(seleccion).accion()
- Vamos a ver distintos tipos de efectos, las posibilidades son enormes
Mostrar/Ocultar
$(seleccion).hide(time, callback) $(seleccion).show(time, callback)
- Los parámetros time y callback son opcioneles
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
< script type = 'text/javascript'
src = "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" >
</script>
<script type="text/javascript">
$(document).ready(activa);
function activa () {
$("#muestra").click(muestra);
$("#oculta").click(oculta);
}
function muestra(){
$("img").show();
}
function oculta(){
$("img").hide();
}
</script>
</head>
<body>
<h1>Mostrando u ocultando imágenes</p>
<button id="muestra">Muestra </button>
<button id="oculta">Oculta</button>
<br />
<img src="naturaleza.jpg" alt="">
</body>
</html>
|
- parámetros opicones
- El primer parámetros especifica el tiempo en el cual ocurre la acción
- Valores
- slow
- fast
- un entero que especifica el tiempo en milisegundos
- El segundo parámetro es una función que se ejecutará cuando haya terminado la acción
|
Modifica el ejercico anterior para que se realice en un tiempo y que luego se muestre un alert diciendo que la imagen se ha mostrado u ocultado
|
devaneciéndose o degradaciones : fade=
Modo presentación : slide
animimaciones: animate y stop
Anidando acciones
Concepto de funciones de callback
jQuery Callback jQuery Chaining
