“elementoHTML.onEnterFrame” y se hizo la animación DHTML fácil!
Os presento mi última sacada de manga, el pequeño objeto OEF (OnEnterFrame).
Con este objeto tenemos el evento onEnterFrame para nuestros elementos HTML!!
-
<HEAD>
-
<script type="text/javascript">
-
//este es el objeto principal
-
oef={
-
fps:24,
-
init:function(){
-
oef.intervalo=Math.round(1000/oef.fps);
-
oef.all=document.body.getElementsByTagName("*");
-
setInterval("oef.onenterframe()",oef.intervalo);
-
oef.onload;
-
},
-
onenterframe:function(){
-
for(var i=0;i<oef.all.length;i++){
-
if(oef.all[i].onEnterFrame){
-
oef.all[i].onEnterFrame();
-
}
-
}
-
}
-
}
-
//estas dos líneas son necesarias :)
-
//imprescindible que no se añada ningún onload por debajo de ellas.
-
oef.onload=window.onload||new Function();
-
window.onload=oef.init;
-
-
</script>
-
<script type="text/javascript">
-
//estas funciones son de ejemplo
-
function getHex(){
-
h = Math.round(Math.random()*0xFF).toString(16);
-
if(h.length==1){h = "0"+h;}
-
return h;
-
}
-
function coloreame(elemento){
-
elemento.onEnterFrame = function(){
-
var rgb = "#" + getHex() + getHex() + getHex();
-
this.style.backgroundColor = rgb;
-
}
-
}
-
</script>
-
</HEAD>
-
<!-- Llamamos a la función coloreame, la cual inicia el evento onEnterFrame -->
-
<body>
-
<input type="button" value="DAME DAME!!" onClick="coloreame(this);" />
-
</body>
Ver el correspondiente ejemplo visual
Soy consciente que esto no es más que un apaño, pero para montar hasta 25 eventos onEnterFrame a la vez tira bien (luego según se le vaya añadiendo "chicha" a la página/funciones que ejecutan el máximo disminuye). A más compleja sea la función que se ejecuta, menos posibilidades hay que funcione fluídamente, pero he trastado con 100 elementos cambiando el fondo y no ha bajado de los 24FPS.
He intentado crearlo como atributo html (como un onClick), pero se pierde el scope, ya que el sistema este es "pauperrimo" y solo es útil para ejecutar acciones desde javascript, aunque, otra solución es poner eso en un onLoad="this.onEnterFrame=funcionaaaa;" donde se ejecute el onEnterFrame, ya que al cargarse se iniciará el evento.
Espero vuestro linchamiento popular :P
Ai si!, es case sensitive (vamos, que se pone con mayusculas) y para quitarlo es con:
-
delete elemento.onEnterFrame;
Comentarios
oye tio, muyyy guapa la page, están muy currados los contenidos, si si.
Deja un comentario