• HTML
• CSS
• JS

HTML

<div class="contenedor-reno">
    <img src="reno_fisgon_capa.png" class="capa1">
    <img src="reno_fisgon.png" class="capa2">
    
    <div class="ojo1" id="ojo1">
        <img src="pupila.png" class="pupila">
    </div>
    <div class="ojo2" id="ojo2">
        <img src="pupila.png" class="pupila">
    </div>
</div>

CSS

.contenedor-reno{
    position:relative;
    
}
.capa1{
    position:absolute;
    z-index:-1;
}
.capa2{
    position:absolute;
    z-index:1;
}
img.capa1,img.capa2{
    width:400px;
    height:400px;
}
.ojo1{
    width:130px; 
    height:140px; 
    position:absolute; 
    left:120px; 
    top:210px;
}
.ojo2{
    width:130px; 
    height:140px; 
    position:absolute; 
    left:160px; 
    top:200px;
}
img.pupila{
    width:18px;
    height:18px;
    margin:82px 0px 0px 74px;
}

JS

EYES = {};
EYES.stack = [];

EYES.follow = function (eye) {
    var el1 = document.getElementById (eye);
    var el2 = el1.getElementsByTagName ("IMG");
    el2 = el2[0];
    el2.centre = (el1.offsetWidth - el2.offsetWidth) / 2;
    el2.style.margin = el2.centre + "px 0 0 " + el2.centre + "px";
    el1.maxDist = 35 * el1.offsetWidth;
    EYES.stack.push ([el1, el2]);
};

EYES.mousemove = function (e){
    
    if (!EYES.stack.length){
        return;
    }

    var mouseX = mouseY = 0;
    if (!e) var e = window.event;
    if (e.pageX || e.pageY) {
        mouseX = e.pageX;
        mouseY = e.pageY;
    } else if (e.clientX || e.clientY) {
        mouseX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
        mouseY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
    }

    for (var e=0, l=EYES.stack.length; e<l; e++){
    
        var el = EYES.stack[e];
        var elX = elY = 0;
    
        if (el[0].offsetParent){
                
                obj = el[0];
                
            do {
                elX += obj.offsetLeft;
                elY += obj.offsetTop;
            } while (obj = obj.offsetParent);
        }
        
        el[0].centreX = elX + Math.round (el[0].offsetWidth / 2);
        el[0].centreY = elY + Math.round (el[0].offsetHeight / 2);
        var difX = mouseX - el[0].centreX;
        var difY = mouseY - el[0].centreY;
        var dTan = Math.atan2 (difX, difY);
        var dist = Math.sqrt ((difX * difX) + (difY * difY));
        dist = Math.sin ((dist > el[0].maxDist ? 1 : dist / el[0].maxDist));
        var newX = el[1].centre + Math.round (Math.sin (dTan) * el[1].centre * dist);
        var newY = el[1].centre + Math.round (Math.cos (dTan) * el[1].centre * dist);
        el[1].style.margin = newY + "px 0 0 " + newX + "px";
    }
};

if (window.attachEvent) document.attachEvent ("onmousemove", EYES.mousemove);
else document.addEventListener ("mousemove", EYES.mousemove, false);

EYES.follow ('ojo1');
EYES.follow ('ojo2');