Page Language="C#" AutoEventWireup="true" CodeBehind
Anuncio
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="fotos1.aspx.cs"
Inherits="WebApplication2.fotos1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Manejo Secuencial de Imagenes</title>
<style>
li {
float: left;
list-style: none;
margin: 0 25px 25px 0;
display: none;
}
</style>
</head>
<body>
<a href="#" id="mostrar">Mostrar</a> / <a href="#"
id="ocultar">Ocultar</a>
<ul>
<li><img src="../img/foto1.jpg"></li>
<li><img src="../img/foto2.jpg"></li>
<li><img src="../img/foto3.jpg"></li>
</ul>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></
script>
<script>
$(document).ready(function() {
var lista = $('li').hide();
$('#mostrar').click(function() {
var i = 0;
(function mostrarimg() {
lista.eq(i++).fadeIn(400, mostrarimg);
})();
});
$('#ocultar').click(function() {
var i = $('li').size();
(function ocultarimg() {
lista.eq(--i).fadeOut(200, ocultarimg);
})();
});
});
</script>
</body>
</html>
