Mootools FormCkeck: comprobación de formularios

ByLuis

Mootools FormCheck es un script que permite añadir comprobaciones a nuestros formularios y que muestre mensajes de error cuando alguna de esas comprobaciones falle.
formcheck.png
Se puede comprobar los errores cuando se realiza un submit o cuando se abandona el elemento HTML (blur). Los errores aparecen como un bocadillo emergente (con posibilidad de cerrar) y se puede especificar el tipo de dato que queremos comprobar: texto, numérico, alfanumérico…
El problema de estas librerías es que existen para un framework en particular, estaría bien que existiera (o crearlo nosotros) un grupo de trabajo que tradujera las librerías útiles a diferentes frameworks (mootools, jquery, yui, …), ya que cuando buscamos un módulo específico a veces lo encontramos para otro framework. ¿Alguien se apunta?.
Mootools FormCkeck
Vía / WebAppers

Similar Posts

| |

Laboratorio: control para direcciones IP

ByLuis

Algo que me suele gustar bastante es que cuando tengo que introducir una dirección IP en un formulario o ventana de Windows, no tenga que estar dándole al tabulador para cambiar de caja de texto. Lo mismo es aplicable cuando se trata de un serial number. Tambien suelo agradecer que hacer un copy/paste, no tenga que ir haciéndolo caja a caja.
control-ip.png

Siempre viene bien hacernos un control para direcciones IP, que permita pegar toda la dirección ip y que se rellenen las cajas correctamente y que al pulsar el punto se mueva de caja, y la verdad es que tampoco es muy difícil de hacer.

Read More “Laboratorio: control para direcciones IP”

Hacer drag & drop de ficheros fuera del navegador con Chrome

ByLuis

Hace tiempo comenté cómo hacer drag & drop directamente sobre el navegador, lo cual nos venía muy bien para subir ficheros (por ejemplo para un correo, galería de fotos, …). Esta vez se trata de descargar ficheros directamente desde el navegador, algo que permite GMail desde Chrome.

El autor de este post lo ha tenido difícil para poder ver cómo lo hace Google, pero al final el código es bastante sencillo:

var file = document.getElementById("dragout");
 
file.addEventListener("dragstart",function(evt){
    evt.dataTransfer.setData("DownloadURL",fileDetails);
},false);

Sólo disponible en Chrome

Drag out files like Gmail

|

Optimizing Search Functionality with Large JavaScript Arrays

ByLuis

Processing arrays can take quite a few bit of time, this is something that can directly impacts the loading speed of your page and depend of the computer and the browser your users use. When you think that a typical users can load your website with a netbook , or an iphone for that matter, speeding up search in large arrays can be a good way to optimize your code …

Post original

|

Ya tenemos nuevo ThickBox

ByLuis

De muchos es conocido Lightbox, y la popularidad que produjo a su autor en su momento cuando se hizo público. Básicamente es uno de los efectos que más se están viendo en páginas webs a la hora de mostrar imágenes. No hablamos de nada nuevo ni lo descubrimos ahora.
pimp_my_thickbox_20.jpg
Y como alternativa a Lightbox tenemos ThickBox 2.0 mucho más ligera y potente con sólo 27Kb de código. ¿Qué son 27Kb que sirven para cosas como esta?.

ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

JsLoad: carga de librerías remota

ByLuis

JsLoad permite cargar librerías Javascript desde los servidores de Google, no tienes que preocuparte por las dependencias de otras librerías, ya que JsLoad se encarga de cargar las dependencias automáticamente.
jsload.png
Además se pueden cargar diferentes versiones de una misma librería, no necesariamente la última versión. Entre las librerías que se pueden cargar nos encontramos: ExplorerCanvas, Facebox, JavaScript-XPath, jQuery, JSDeferred, Lightbox, MooCanvas, MooTools, Processing.js, Prototype, script.aculo.us, Taffy DB y textMonster.
JsLoad
Vía / meme

FancyBox: zoom de imágenes mediante Javascript

ByLuis

Buen script creado en jQuery que permite añadir zoom a imágenes. Está testado en IE6, IE7 y Firefox. Entre las características muestra en una ventana lightbox la imagen en un tamaño mayor, pudiendo ajustarse al tamaño de la ventana y mostrando un marco alrededor de la imagen. Además permite mostrar un grupo de imágenes de forma común.

fancybox.png

Un ejemplo de uso sería el siguiente:

$(function() {
$("div#test_zone a").fancybox();
});

FancyBox