Forum Moderators: open
Really, this code is a decent base for any kind of javascript animation project. The basis for the code shown below is available from Apple [developer.apple.com].
<script>
var timeout;
function appear(){
var the_style = getStyle("floatingFlash");
if (the_style) {
var current_top = parseInt(the_style.top);
var new_top = current_top + 5;
if (document.layers) {
the_style.top = new_top;
} else {
the_style.top = new_top + "px";
}
if (new_top < 150) {
the_timeout = setTimeout('appear();',10);
}
}
} // appear
function disappear() {
var the_style = getStyle("floatingFlash");
the_style.display = 'none';
} // disappear
function getStyle(ref) {
if(document.getElementById && document.getElementById(ref)) {
return document.getElementById(ref).style;
} else if (document.all && document.all(ref)) {
return document.all(ref).style;
} else if (document.layers && document.layers[ref]) {
return document.layers[ref];
} else {
return false;
}
} // getStyle
</script>
<style>
#floatingFlash {
position:absolute;
border:1px solid red;
background:white;
}
</style>
<body onload="appear();">
<div id="floatingFlash" style="top:-400px;left:-150px;margin-left:50%;">
<a href="javascript:disappear();">X</a>
<img src="/example.gif" style="width:300px;height:240px;" />
</div>
</body>