Hola,
Quisiera saber como se puede generar el efecto fade in y fade out para una clase de div, es decir, hacerlo a traves de
Código:
<div class="clase"></div>
.
Lo que encontré, navegando aquí en los foros me sirvió pero solo para las id de las div, de manera que si quisiera hacerlo para más de una no sirve ya que el código solo funciona para un solo tipo de div, lo que quiero es que funcione para todas las que requiera que aparezcan.
Código:
<style type="text/css">
#escondido{
width:400px;
height:200px;
background:steelblue;
color:#fff;
display:none;
}
</style>
<script type="text/javascript">
var color = 0;
var suma = 10;
function aparecer(){
var obj = document.getElementById('escondido');
obj.style.display = "block";
color += suma;
if (!(color>=110)){
obj.style.filter = 'alpha(opacity='+color+')';
obj.style.opacity = color /100;
obj.style.MozOpacity = color /100;
obj.style.KHTMLOpacity = color /100;
window.setTimeout ("aparecer();", 100);
}
}
function desvanecer() {
var obj2 = document.getElementById('escondido');
color -= suma;
if (!(color <=-10)){
obj2.style.filter = 'alpha(opacity='+color+')';
obj2.style.opacity = color /100;
obj2.style.MozOpacity = color /100;
obj2.style.KHTMLOpacity = color /100;
window.setTimeout ("desvanecer();", 100);
}
}
function llama(){
if (color<=0){
aparecer();
}
else {
desvanecer();
}
}
</script>
</head>
<body>
<span onclick="llama();">Click Aqui</span>
<div id="escondido">
<p>Lorem ipsum vel commune praesent maiestatis in, no suavitate
persecuti sententiae ius, ea cum facete sanctus detracto. Saepe
recteque tractatos qui te, ius summo mentitum at. Sed etiam option
delicatissimi ad. Alia altera lobortis vim id, id iisque commune
cum.</p>
</div>
</body>
</html>
Espero que me puedan ayudar.
Muchas Gracias y Saludos!!!!