XHTML-CSS, Accesibilidad, PHP y más
Inicio
Desarrollo web
Archivo por Categoría 'Javascript'
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.
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)
Fecha de publicación: 2010/01/14
Desactivar Javascript en IE 6 es sencillo, tan solo hay que seguir los siguientes pasos:
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:

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

Para obtener ese efecto es necesario el uso de Javascript, pero con HTML 5 eso se va a terminar.
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.
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';
}