Tag Archives: JavaScript

Corregir el z-index de animaciones Flash

Mientras trabajaba en una página web (que tenía un menú desplegable en CSS y algunas animaciones en Flash) encontré que estos objetos SWF siempre se mostraban sobre todos los demás layers de la web, sin importar que valores le pusiera al z-index de los elementos involucrados.

La solución resultó sencilla, solo bastaba agregar el valor transparent al parámetro wmode del objeto SWF, quedándo de la siguiente manera:

<object type="application/x-shockwave-flash" data="swf/animacion.swf" width="760" height="80">
  <param name="movie" value="swf/animacion.swf" />
  <param name="wmode" value="transparent">
</object>

Como yo estaba utilizando swfobject para colocar las animaciones en Flash de manera más práctica, entonces el cambio fue:

<script type="text/javascript">
  var flashvars = {};
  var params = {};
  params.wmode = "transparent";
  var attributes = {};
  swfobject.embedSWF("swf/animacion.swf", "header", "760", "80", "9.0.115", "swf/expressInstall.swf", flashvars, params, attributes);
</script>

jQuery 1.3 y Thickbox 3.1

Con la nueva versión de jQuery han venido muchos cambios interesantes. Hay uno que afecta a Thickbox directamente (un lightbox muy bueno que no ha sido actualizado desde hace dos años) y es que la nomenclatura para [@attr] ha pasado a ser simplemente [attr]. Para arreglarlo, basta modificar la línea 79 en el archivo thickbox.js:

TB_TempArray = $("a[@rel="+imageGroup+"]").get();

Y dejarla así (quitándole el @):

TB_TempArray = $("a[rel="+imageGroup+"]").get();

jQuery: Evitar la modificación del contenido de un inputbox

Si en un formulario HTML queremos evitar que los usuarios escriban dentro de elementos inputbox <input type=”text” /> podemos hacer uso de la fantástica librería de JavaScript jQuery para lograr este efecto de una manera no obstructiva.

El siguiente código hace toda la magia, y según creo se explica solo bastante bien.

1
2
3
$("input[type=text]").focus(function(){
    $(this).blur();
});

De todas maneras, nunca está demás la aclaración. La primera parte es el selector por el cual jQuery va a seleccionar todos las etiquetas input que tengan el atributo type como text. Luego, a este subconjunto, se les va a anexar una función a su evento OnFocus (cuando adquiran el foco, el cursor). El contenido de esta función ($(this).blur();) le dice a jQuery que le haga perder el foco al elemento padre (this, que viene a ser el input).