Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/08/2009, 06:38
Avatar de susaninhax
susaninhax
 
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 20 años, 3 meses
Puntos: 3
Cambiar de una capa a otra con fadeIn y fadeOut

buenas compañeros;

necesito hacer un script que me pase de una capa a otra con fade in y fade out haciendo click en un boton, enlace, etc.

Código HTML:
<script language="javascript" src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script  language="javascript"  type="text/javascript">
$(document).ready(function(){
    
    $("#click1").click(function () {
      $("#capa1").fadeOut(1500, function () {
        $("#capa1").css("display","none");
      });
      $("#capa2").fadeIn(1500, function () {
        $("#capa2").css("display","block");
      });
    });


    $("#click2").click(function () {
      $("#capa2").fadeOut(1500, function () {
        $("#capa2").css("display","none");
      });
      $("#capa1").fadeIn(1500, function () {
        $("#capa1").css("display","block");
      });
    });

});
</script>

<style type="text/css">
<!--
.rojo {
	background-color: #FF0000;
	position:absolute;
	width:100%;
	height:200px;
	left:0px;
	top:0px;
}
.azul {
	background-color: #0000FF;
	position:absolute;
	width:100%;
	height:200px;
	left:0px;
	top:0px;
	text-align:right;
	display:none;
}
.azul a{
	color:#FFFFFF;
}
-->
</style>

<div class="rojo" id="capa1"><a href="javascript:void(0);" id="click1">Cambiar capa</a></div>
<div class="azul" id="capa2"><a href="javascript:void(0);" id="click2">Cambiar capa</a></div> 
alguien sabe alguna otra manera de hacer este script apto para moviles? necesito hacer un script d este estilo que se vea bien en navegadores moviles, el caso es que este no se aprecia, no se ve. alguien sabría como hacer un efecto parecido de un modo distinto????

GRACIAS DE ANTEMANO.