//The Javascript: as noted above, it works fine UNTIL the mouse goes over the inside IMG
//EDIT: I guess this is the "bubble" problem of the "onMouseOver" method, which is an identified issue
//Is there some workaround this ?
var imgObj = null;
var tim;
var counter;
function init(){
imgObj = document.getElementById('myImage');
imgObj.style.position= 'relative';
imgObj.style.top= '0px';
counter = 0;
}
function moveUp(){
if ( counter < 5) {
imgObj.style.top = parseInt(imgObj.style.top) - 3 + 'px';
counter ++;
tim = setTimeout("moveUp()", 20);
}
else {
counter = 0;
clearTimeout(tim);
imgObj.style.top='-18px';
}
}
function moveDown(){
//console.log("moveDown");
if (counter < 5) {
imgObj.style.top = parseInt(imgObj.style.top) + 3 + 'px';
counter ++;
tim = setTimeout("moveDown()", 20);
}
else {
clearTimeout(tim);
counter = 0;
imgObj.style.top='0px';
}
}
function doNothing() {
console.log("doNothing");
}
window.onload =init;