Entendiendo "codiguillos de jabierB" duda con sitaxis

[Albuss]

Buenas!

Antes de nada, decir que esto lo habia enviado como mensaje privado a JavierB, pero me di cuenta de que ese no era el modo, de modo que hago publico el tema para cuando resolvamos mi duda, cualquiera que tenga la misma duda en un futuro pueda buscarlo en la web.


Referente a la web :http://www.telefonica.net/web2/blas-mar/leercss.html , la seccion de leer CSS externo.

En esta web se expone un modo de leer y modificar valores CSS :

Código:

function cambiarPropiedad(regla,propi,valor) {
  if (document.all)
    miRegla = document.styleSheets[0].rules;
  else
    miRegla = document.styleSheets[0].cssRules;
  for (i=0; reg=miRegla[i]; i++)
    if (reg.selectorText.toLowerCase() == regla.toLowerCase() )
      reg.style[propi]=valor;
}

Mi duda es la siguiente:

Sabiendo que le podemos enviar como argumentos, una regla, una priedad y un valor.

Si en vez de una regla como por ejemplo una clase (como en el ejemplo) quiero cambiar un @keyframe, ¿como afecta esto a la sintaxis? ¿como puedo acceder y pasarle los valores de los frames de 0% a 100%? ¿como puedo posteriormente mandarle reglas especificas dentro del rango del frame?

Ejemplo :

@keyframe ejemplo {
0% {tranform:rotate(0deg);}

100%{tranform:rotate(180def);}
}


Si quiero modificar el tranform que esta dentro del frameset 0% ¿como es la sintaxis para enviarle como argumento dicha propiedad?

[Albuss]

he seguido el código de buenas practicas, espero que JavierB o cualquier otro crack sobre Javascript, pueda iluminarme.


No pido el trabajo hecho, con una referencia, un link , un empujóncito para sacar por mi solo ese código...

[Albuss]

Pero tanto cuesta echarme un cable? o almenos decirme que lo que intento de hacer no se puede?

Estoy harto de bucear en google, no encuentro informacion relevante sobre esto, estoy desesperado !!! :(

[zerokilled]

¡buenas!
considera que estas usando css3 y pueden haber miembros que aún no trabaja en ello. aunque tampoco estoy seguro si es css3 porque no conozco esa sintaxis donde el elemento parece ser el 0% y 100%. en fin, yo tu inspeccionaria en la consola como se representan esas propiedades css en javascript. intentalo en web developer de chrome o firebug para firefox.

[Albuss]

Eso ya lo he hecho! , he inspecionado cada elemento, pero la consola devuelve parametro "ILLEGAL".

Quizas en vez de crear una regla transform en el 0% pueda llamar a una clase .., pero de todas formas, lo mas importante para mi es saber si se pueden llamar o no a los framesets

[Albuss]

https://developer.mozilla.org/Es/DOM/CSS , aqui hay una lista de propiedades CSS que están implementadas en el DOM de Gecko 1.8 .


No aparece Keyframes, mi pregunta es la siguiente, ¿estoy totalmente jodido?

[Albuss]

En vez de 0% o 100% tambien se pueden emplear las palabras clave : from (0%) y to (100%) quizas esto si sirva para pasarlo como agumento a auna funcion, pero exactamente me falta saber que sitaxis emplear.

[zerokilled]

Eso ya lo he hecho! , he inspecionado cada elemento, pero la consola devuelve parametro "ILLEGAL".

creo que no lo haz entendido o yo no me explique. no me refiero a que intentes acceder a la propiedad css mediante una expresión completa de javascript hacia la propiedad css en particular. me refiero a que inspecciones el objeto styleSheets para ver como se representan dichas propiedes. si estas en chrome, en la consola escribes document.styleSheets e inspeccionas el árbol de propiedades que te imprime. si estas en firefox, en la consola de firebug escribes lo mismo y la consola te muestra un "enlace" del cual al traer el menu contextual te aparece la opción de inspeccionar en la pestaña DOM y ahi puedes explorar todas las propiedades.

[Panino5001]

Yo sigo sin entender bien tus objetivos.
Quizá estos enlaces te ayuden:
http://stackoverflow.com/questions/5...nimation-rules
http://hacks.mozilla.org/2011/09/det...in-javascript/

Eso, junto con lo que ya vimos acerca de transformaciones y eventos de animación y temporizadores ya debería darte todas las herramientas para hacer lo que necesites con animación y transformación via css/javascript (sea lo que sea que estés intentando), a menos que te empecines en hacerlo de una manera en particular.

[Albuss]

Gracias a todos por interesaros, pero finalmente voy a decantarme por algo mas sencillo, voy adejar que los keyframes sean implantados por todos los navegadores y sean standarizados correctamente.

[zerokilled]

para que entiendas la situación del por qué no te funciona el código.

Código:

<style type="text/css">
@-webkit-keyframes some{
0%{color: black;}
100%{color:white;}
}
p{
-webkit-animation: some 1s infinite;
}
</style>

en esta captura representa el objeto jerarquico del código anterior. nótese el primer índice de la colección cssRules y comparalo con el segundo índice. en particular, son objetos distintos: el primero es un objeto CSSKeyframesRule y el segundo un objeto CSSStyleRule. incluso los prototipos son distintos (fondo rojo). desconozco si es la forma estandarizada pero aparentemente cuando la regla se compone de un arroba el DOM no crea un objeto CSSStyleRule como sucede con los selectores normales. en cambio, genera un objeto similar a CSSStyleSheet donde el prototipo se parece, es decir tiene los métodos insertRule y deleteRule. (en la captura no se muestra el prototipo de un CSSStyleSheet.) en fin, tienes que adaptar el código para que determine si la regla en que actualmente esta iterando es un objeto CSSStyleRule o uno más complejo como CSSKeyframesRule.