Javascript embebido en CSS

Sirdawn · #1 (**permalink**) 24/12/2005, 11:21

Hola a todos.

Entiendo la locura de mi pregunta... pero tenía que hacerla. Alguien conoce cómo poder introducir código Javascript dentro de las propiedades CSS??

Por ejemplo... el método onClick del tag <a>, ya que muchas veces siempre hace lo mismo... habría alguna forma de pasarlo a CSS??, por ejemplo:

Código:

a
{
   onClick: <código Javascript>;
}

Gracias!!

JavierB · #2 (**permalink**) 24/12/2005, 11:29

Hola Sirdawn

El código Css tiene que ir en un archivo .css y el código JavaScript en un archivo .js Que yo sepa no se pueden mezclar.

Si dices que es concretamente lo que quieres hacer es posible que podamos echarte una mano.

Saludos,

Sirdawn · #3 (**permalink**) 24/12/2005, 11:51

Gracias Javier por el interés.

Hay código Javascript que siempre intento ejecutar, por ejemplo, en el caso del método onClick. Un ejemplo sería el siguiente:

<a href="<url>" onClick="this.blur();">

Mi duda sería el poder encapsular este trozo de código Javascript dentro del tag <a> (en un fichero CSS) para que así siempre se ejecutase. Algo parecido a como he puesto en el ejemplo de mi mensaje anterior:

a { onClick: <código Javascript>; }

Por lo que entiendo de CSS... solamente se pueden tocar las propiedades "estáticas" de los tags.

Gracias!!

JavierB · #4 (**permalink**) 24/12/2005, 12:13

Hola de nuevo.

Puedes crear una función, en la misma página o en un archivo .js y llamarla con <body onload="ini()">

Código PHP:

  function ini() {
  for(i=0;ele=document.links[i];i++)
    ele.onclick = function() {this.blur()}
}

Saludos,

Sirdawn · #5 (**permalink**) 25/12/2005, 06:34

Así me gusta... un auténtico profesional, tanto en CSS como en Javascript

Muchas gracias Javier!!

JavierB · #6 (**permalink**) 25/12/2005, 11:10

Voy a ponerme colorado. En fín, Pilarín, lo importante es que te haya funcionado. Hasta pronto.

panotxo · #7 (**permalink**) 01/09/2008, 17:36

Sí se puede embeber javascript en css, yo sólo he conseguido que funcione en el IE. De hecho encontré el código buscando un max-width y min-width que funcionara en el dichoso IE. El formato es el siguiente, con un ejemplo queda clarito:

En el fichero css:
body{
width:expression(
document.body.clientWidth > 1200?
"1150px":
document.body.clientWidth > 800?
document.body.clientWidth-50+"px":
"750px":
"auto" );
}
Insisto, no he conseguido que funcione en mozillas, pero estoy convencido que existe alguna manera.

buzu · #8 (**permalink**) 02/09/2008, 00:40

Eso es otro invento de Explorer. Fue introducido en IE 5.0 y en lo personal se me hace una tontería, una estupidez valla.Sin embargo, es bueno que lo menciones ya que nos da la oportunidad de alertar a los chiquillos sobre esa mala practica. Lo mismo se puede lograr usando javascript y DOM lo cual seria lo correcto.

Saludos.

Panino5001 · #9 (**permalink**) 02/09/2008, 01:45

Sólo agregar que el post es de hace 3 años y que hay mejores ejemplos de uso de javascript en css, como xbl (para firefox) o htc (para explorer):
xbl: http://developer.mozilla.org/en/CSS/...d/XBL_bindings
htc: http://me.eae.net/archive/2005/12/29/canvas-in-ie/