JavaScript

jQuery — Sin comentarios
28
Abr 10

Almacenamiento local con jQuery y HTML5

Para muchas aplicaciones web puede ser muy útil almacenar algunos datos directamente en el navegador del usuario.
jStorage (llamado anteriormente DOMCache) permite su eso de forma muy sencilla. Es compatible con Prototype, JQuery o MooTools, y prácticamente con cualquier navegador (Aquí varía la cantidad de espacio que puede almacenarse en cada uno, en general 5MB salvo IE6 e IE7 que permiten 128kb).
aquí viene un ejemplo de su uso con JQuery:

<script src="jquery.js"></script>
<script src="jstorage.js"></script>
<script>
// Verifica que existe "key"
var value = $.jStorage.get("key");
if(!value){
	// Si no carga los datos del servidor
 	value = load_data_from_server()
 	// y se guarda
	$.jStorage.set("key",value);
}
</script>
JavaScript — Sin comentarios
26
Abr 10

Crear un pequeño plugin para barra de marcadores

Actualmente todos los navegadores (a excepción de Internet Explorer, como siempre) acepta añadir a la barra de marcadores funciones javascript que nos pueden facilitar la vida.

En esta ocasión traigo cómo hacer que se envíen datos a una página en función de un texto seleccionado en la página actual, así al pinchar en la barra de marcadoes haría lo que le dijéramos con ese texto.

Lo primero que hay que tener en cuenta es cómo se añade el javascript a la barra de marcadores. Siempre hay que empezar con

javascript:

Después hay que añadir lo que queremos que haga. Aquí teneis un ejemplo para comprobar el whois de un dominio en el caso de seleccionarlo:

javascript:location.href='http://www.who.is/' + encodeURIComponent(document.getSelection());

Si lo que queremos es comprobar el dominio donde estamos podemos emplear:

javascript:location.href='http://www.who.is/' + encodeURIComponent(document.location.href);
JavaScript — 1 Comentario
11
Abr 10

Formularios estilo inline en HTML y javascript

En muchos formularios nos puede venid bien que tengan un formato inline al estilo del login de facebook, es decir, que el contenido del campo nos indique qué hay que introducir y cuando vayamos a ese campo eliminemos el contenido para que el usuario lo rellene. Con esto nos ahorraríamos poner “label” para cada campo.

<input type="text" name="mi_variable"
     onfocus="if( this.value == 'etiqueta' ) { this.value = ''; }"
     onblur="if( this.value == '' ) { this.value = 'etiqueta'; }"
     value="etiqueta" />

Siendo ‘etiqueta’ el nombre del contenido. En el caso de las contraseñas se podría hacer igual pero solamente veríamos asteriscos, así que habría que cambiar el type también. Como añadido podríamos cambiar el color según es onfocus u onblur a través de this.style.color.
Aquí va otro ejemplo:

<input type="text" name="Password"
     onfocus="
       if( this.value == 'Password' ) {
          this.value = ''; // Borramos el contenido para dejarlo limpio para el usuario
          this.style.color = '#000000'; // Lo ponemos en negro
          this.type = 'password'; // Lo convertimos en password para que muestre asteriscos
       }"
     onblur="
       if( this.value == '' ) {
          this.value = 'Password'; // Volvemos a ponerle el texto en caso de no haber añadido una password
          this.style.color = '#CCCCCC'; // Lo ponemos en gris
          this.type = 'text'; // Lo pasamos a texto si no ha introducido password
       }"
     value="Password" />
JavaScript / PHP / jQuery — Sin comentarios
19
Feb 10

Cargar un php con jquery a través ajax.

En esta ocasión proponemos un snippet para ejecutar un php dentro de un div con jquery.

$(document).ready(function() {
    $('#divdondequeremoscolocarlo').load(
        '/mifichero.php', { id: '1' });
});