Voy a poner el codigo completo, es bastante rallada, pero se que mucha gente no tiene el interpretador de php instalado y tal, para que pueda probar el codigo:
Código PHP:
<script language="JavaScript" type="text/javascript">
function hazClip(id,t,r,b,l){
if(document.all){
obj=document.all[id]
obj.style.clip="rect("+t+","+r+","+b+","+l+")";
obj.clippedT=t;
obj.clippedR=r;
obj.clippedB=b;
obj.clippedL=l;
}
else if(document.layers){
obj=document.layers[id];
obj.clip.top=obj.clippedT=t;
obj.clip.right=obj.clippedR=r;
obj.clip.bottom=obj.clippedB=b;
obj.clip.left=obj.clippedL=l;
}
else if(document.getElementById){
obj=document.getElementById(id)
obj.style.clip="rect("+t+","+r+","+b+","+l+")";
obj.clippedT=t;
obj.clippedR=r;
obj.clippedB=b;
obj.clippedL=l;
}
}
function cabezaMouseOver(id) {
obj=document.getElementById(id);
anterioresClips=new Array( obj.clippedT , obj.clippedR , obj.clippedB , obj.clippedL );
hazClip(id, anterioresClips[0]-2 , anterioresClips[1]+2 , anterioresClips[2]+2 , anterioresClips[3]-2 );
}
function cabezaMouseOut(id) {
obj=document.getElementById(id);
anterioresClips=new Array( obj.clippedT , obj.clippedR , obj.clippedB , obj.clippedL );
hazClip(id, anterioresClips[0]+2 , anterioresClips[1]-2 , anterioresClips[2]-2 , anterioresClips[3]+2 );
}
</script>
<div id="cabeza0-0" style="z-index:1;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-0')" onmouseout="cabezaMouseOut('cabeza0-0')"></div>
<script>
hazClip("cabeza0-0", 64*0 , 753-68*10 , 258-64*3 , 68*0 )
</script>
<div id="cabeza0-1" style="z-index:2;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-1')" onmouseout="cabezaMouseOut('cabeza0-1')"></div>
<script>
hazClip("cabeza0-1", 64*0 , 753-68*9 , 258-64*3 , 68*1 )
</script>
<div id="cabeza0-2" style="z-index:3;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-2')" onmouseout="cabezaMouseOut('cabeza0-2')"></div>
<script>
hazClip("cabeza0-2", 64*0 , 753-68*8 , 258-64*3 , 68*2 )
</script>
<div id="cabeza0-3" style="z-index:4;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-3')" onmouseout="cabezaMouseOut('cabeza0-3')"></div>
<script>
hazClip("cabeza0-3", 64*0 , 753-68*7 , 258-64*3 , 68*3 )
</script>
<div id="cabeza0-4" style="z-index:5;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-4')" onmouseout="cabezaMouseOut('cabeza0-4')"></div>
<script>
hazClip("cabeza0-4", 64*0 , 753-68*6 , 258-64*3 , 68*4 )
</script>
<div id="cabeza0-5" style="z-index:6;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-5')" onmouseout="cabezaMouseOut('cabeza0-5')"></div>
<script>
hazClip("cabeza0-5", 64*0 , 753-68*5 , 258-64*3 , 68*5 )
</script>
<div id="cabeza0-6" style="z-index:7;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-6')" onmouseout="cabezaMouseOut('cabeza0-6')"></div>
<script>
hazClip("cabeza0-6", 64*0 , 753-68*4 , 258-64*3 , 68*6 )
</script>
<div id="cabeza0-7" style="z-index:8;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-7')" onmouseout="cabezaMouseOut('cabeza0-7')"></div>
<script>
hazClip("cabeza0-7", 64*0 , 753-68*3 , 258-64*3 , 68*7 )
</script>
<div id="cabeza0-8" style="z-index:9;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-8')" onmouseout="cabezaMouseOut('cabeza0-8')"></div>
<script>
hazClip("cabeza0-8", 64*0 , 753-68*2 , 258-64*3 , 68*8 )
</script>
<div id="cabeza0-9" style="z-index:10;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-9')" onmouseout="cabezaMouseOut('cabeza0-9')"></div>
<script>
hazClip("cabeza0-9", 64*0 , 753-68*1 , 258-64*3 , 68*9 )
</script>
<div id="cabeza0-10" style="z-index:11;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza0-10')" onmouseout="cabezaMouseOut('cabeza0-10')"></div>
<script>
hazClip("cabeza0-10", 64*0 , 753-68*0 , 258-64*3 , 68*10 )
</script>
<div id="cabeza1-0" style="z-index:12;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-0')" onmouseout="cabezaMouseOut('cabeza1-0')"></div>
<script>
hazClip("cabeza1-0", 64*1 , 753-68*10 , 258-64*2 , 68*0 )
</script>
<div id="cabeza1-1" style="z-index:13;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-1')" onmouseout="cabezaMouseOut('cabeza1-1')"></div>
<script>
hazClip("cabeza1-1", 64*1 , 753-68*9 , 258-64*2 , 68*1 )
</script>
<div id="cabeza1-2" style="z-index:14;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-2')" onmouseout="cabezaMouseOut('cabeza1-2')"></div>
<script>
hazClip("cabeza1-2", 64*1 , 753-68*8 , 258-64*2 , 68*2 )
</script>
<div id="cabeza1-3" style="z-index:15;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-3')" onmouseout="cabezaMouseOut('cabeza1-3')"></div>
<script>
hazClip("cabeza1-3", 64*1 , 753-68*7 , 258-64*2 , 68*3 )
</script>
<div id="cabeza1-4" style="z-index:16;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-4')" onmouseout="cabezaMouseOut('cabeza1-4')"></div>
<script>
hazClip("cabeza1-4", 64*1 , 753-68*6 , 258-64*2 , 68*4 )
</script>
<div id="cabeza1-5" style="z-index:17;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-5')" onmouseout="cabezaMouseOut('cabeza1-5')"></div>
<script>
hazClip("cabeza1-5", 64*1 , 753-68*5 , 258-64*2 , 68*5 )
</script>
<div id="cabeza1-6" style="z-index:18;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-6')" onmouseout="cabezaMouseOut('cabeza1-6')"></div>
<script>
hazClip("cabeza1-6", 64*1 , 753-68*4 , 258-64*2 , 68*6 )
</script>
<div id="cabeza1-7" style="z-index:19;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-7')" onmouseout="cabezaMouseOut('cabeza1-7')"></div>
<script>
hazClip("cabeza1-7", 64*1 , 753-68*3 , 258-64*2 , 68*7 )
</script>
<div id="cabeza1-8" style="z-index:20;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-8')" onmouseout="cabezaMouseOut('cabeza1-8')"></div>
<script>
hazClip("cabeza1-8", 64*1 , 753-68*2 , 258-64*2 , 68*8 )
</script>
<div id="cabeza1-9" style="z-index:21;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-9')" onmouseout="cabezaMouseOut('cabeza1-9')"></div>
<script>
hazClip("cabeza1-9", 64*1 , 753-68*1 , 258-64*2 , 68*9 )
</script>
<div id="cabeza1-10" style="z-index:22;position:absolute;left:10px;top:10px;"><img src="imgs_titulo/cabeza.jpg" onmouseover="cabezaMouseOver('cabeza1-10')" onmouseout="cabezaMouseOut('cabeza1-10')"></div>
<script>
hazClip("cabeza1-10", 64*1 , 753-68*0 , 258-64*2 , 68*10 )
</script>