Hola
MaBoRaK : ¿
ecuaciones? ... ¿
algoritmo? ... ¿
valor flotante? ...
¿Estás tratando de asustar a
B031? . Todos sabemos que nos está engañando, ¡pero no me parece tan grave!
Hola
B031 : las animaciones se hacen con un escript; algunas caben en HTML o CSS (lo que puede ser discutible), pero si es "paso a paso" como para transparentar de a poco, seguro debes usar flashscript, visualscript, jscript o —si vas a poner
opacity y
alpha— javascript, que anda en todos los navegadores.
Estos ejemplos se repiten desde hace años en el Foro y en toda la web, en sus variantes de hacer aparecer y desaparecer la imagen, al hacer click o pasar el puntero o quitar el puntero o pulsar un botón, o de forma automática en las transiciones carrousel (que no hacen más que transparentar la imagen de adelante para que se vea la de atrás). El "paso a paso" también tiene ejemplos para tirar al techo, porque como ya se dijo, sirve para cualquier efecto que cambie gradualmente.
Es imposible no encontrarlos.
Te dejo más códigos para que estudies y adaptes al tuyo. Y además aprovecho tu tema para dejar una variante que se me ocurrió mientras lo leía. No se parece a lo que pides, pero igual te va a servir para estudiar otra forma de hacer un "paso a paso manual". El cambio es 'borrando' con la manito sobre la imagen, que cambia cada 200 milisegundos a una transparencia de 0.05 por paso.
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<title>BORRAR IMAGEN.</title>
<script type="text/javascript">
var transp = 1;
var espera = 0;
var tiempo;
function borra(T) {
if((espera == 0) && (transp > 0.01)){
document.title = transp;
transp = transp - 0.05;
T.style.MozOpacity = transp;
T.style.KhtmlOpacity = transp;
T.style.opacity = transp;
(T.filters)? T.filters.alpha.opacity = transp*100 : "";
espera = 1;
tiempo = setTimeout("espera = 0" , 200);
}
}
function dibuja(T) {
clearTimeout(tiempo);
transp = 1;
espera = 0;
T.style.MozOpacity = transp;
T.style.KhtmlOpacity = transp;
T.style.opacity = transp;
(T.filters) ? T.filters.alpha.opacity = transp*100 : "";
document.title = transp;
}
</script>
<style type="text/css">
body {color: #ffffff; background-color: #000000; background-image: url("http://www.forosdelweb.com/images/buttons/firstnew.gif"); }
img {cursor: pointer; height:143px; width:150px; opacity:1; -moz-opacity:1; khtml-opacity:1; filter:alpha(opacity:100); font-family:cursive, fantasy, decorative; color:#808080; }
img {cursor: -moz-grab;}
h2 {background-color::#000000;}
</style>
</head>
<body>
<h2>Imagen se borra al mover el puntero por encima.</h2>
<img src="http://www.forosdelweb.com/images/vbulletin3_logo_fdw.gif" alt="Borrable" onmousedow="return false" onmousemove="borra(this)"; onmouseout="dibuja(this)">
</body>
</html> Opacidad de una capa Fade En Imagenes Efecto 'enfoque' con cambio de opacidad CRear efecto de transicion entre dos imagenes Presentación de Imagenes (Slide Show) Tablas tranparentes y Contenido 100% Visible