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.