Outbook

XHTML-CSS, Accesibilidad, PHP y más

Inicio que contiene a Desarrollo web que contiene a Archivo por Categoría 'Javascript'

Datos de búsqueda

Categoría: ‘Javascript’

Javascript: Precarga de imágenes

Fecha de publicación: 2010/03/07

Hay que advertir que esta técnica no es la adecuada para los rollover en CSS, para los que es más correcto el uso de CSS Sprites. Se ajusta más para aquellas ocasiones en las que hay que hacer un rollover en elemento de imagen (IMG), para que el estado hover no aparezca momentáneamente sin imagen, o imágenes dentro de fragmentos de HTML generados mediante Javascript, para que se muestren inmediatamente.

Leer el resto del artículo

Datos del artículo:

PHP y Javascript: Subir múltiples archivos

Fecha de publicación: 2010/02/28

Esta semana estuve montando un PHP que sirviese para subir y eliminar archivos en un servidor, y que además lo pudiese hacer sin necesidad de recargar la página.

Para subir los archivos y no recargar la página ha sido necesario utilizar un elemento iframe como destino del formulario de envío (no encontré otro modo). Si no se dispone de Javascript funciona de igual modo, pero recargando la página y sin el iframe.

En principio es accesible, quizá le falta WAI ARIA y revisar que el foco no pase al iframe (En Firefox y en Internet Explorer 6 no parece que eso de problemas).

Este es un script del que no puedo poner ejemplo, ya que sería arriesgado por temas de spam, pero basta con descomprimir el descargable en una carpeta del servidor para poder probarlo. Descargar ejemplo (ZIP, 113KB)

Datos del artículo:

Desactivar Javascript en Internet Explorer 6

Fecha de publicación: 2010/01/14

Desactivar Javascript en IE 6 es sencillo, tan solo hay que seguir los siguientes pasos:

Leer el resto del artículo

Datos del artículo:

HTML 5: Atributo placeholder

Fecha de publicación: 2010/01/09

Resulta muy habitual encontrarse con campos de texto que contienen un valor por defecto que ayuda al usuario a comprender que información debe introducir en dicho campo. El comportamiento habitual es que cuando el usuario activa el campo el texto desaparezca.

Este es el estado antes de activar el campo y una vez se desactiva sin haber introducido datos:

Atributo placeholder (campo inactivo)

Y este es el estado del campo activado antes de haber introducido información:

Atributo placeholder (campo activo)

Para obtener ese efecto es necesario el uso de Javascript, pero con HTML 5 eso se va a terminar.

Leer el resto del artículo

Datos del artículo:

Javascript: establecer atributo readonly en campos de formulario

Fecha de publicación: 2009/12/29

El atributo readonly se establece en Javascript mediante true o false:

var campo = document.getElementById('campo_formulario');
campo.readOnly = true; // Se añade el atributo
campo.readOnly = false; // Se quita el atributo

Un detalle en el que hay que fijarse, ya que de ello dependerá que el script funcione, es la "O" mayúscula al especificar el atributo.

Datos del artículo:

Javascript: Click outside element

Fecha de publicación: 2009/11/05

Simply function to detect click event outside desired element:

document.onclick = function (e) {
 e = e || event
 var target = e.target || e.srcElement
 var element = document.getElementById('id_element');
 do {
  if (element == target) {
   // When clicked inside element, does nothing
   return;
  }
  target = target.parentNode;
 } while (target)
 // When clicked outside element, makes an action.
 element.style.display = 'none';
}

Read at Closing a floating div layer Webdeveloper.com.

Datos del artículo:

Información del sitio