domingo, 2 de junio de 2013

mPushState, una solución para pushstate con soporte cross browser


En ocasiones estamos trabajando en desarrollo web, los nuevos estándares están bastante altos, se requiere cada vez aplicaciones mas rápidas, para lo cual se recurre a Ajax), pero el detalle es que el cliente navega por nuestra página cargando distinto contenido asíncrono, y cuando éste quiere compartir lo que esta viendo con otra persona se encuentra con que el link enviado no guía a la otra persona hasta donde él estaba navegando, o si quiere guardarlo en marcador sucede lo mismo, tiene que buscar nuevamente el punto en que se quedó, navegando por segunda, tercera o cuantas veces requiera nuestra página para encontrar el contenido deceado, para ello existe “pushstate”, una funcionalidad para poder modificar la url del cliente mientras él navega asíncrono por nuestra web.


Actualmente HTML5 soporta “pushstate” para manejar estas variables de navegación sin tener que recargar la ventana, pero actualmente mas del 30% de las personas utilizan Internet Explorer 8 o inferior que no soportan HTML5 y por consiguiente pushstate.


La solución, mPushState v1.2: una librería que nos permite agregar, quitar y editar variables de la url sin recargar la ventana del navegador de forma fácil y rápida, con soporte para los ie8 e inferiores a travez del hash, así como para los navegadores que ya trabajan con HTML5.


La librería se encuentra en https://bitbucket.org/m0rf3o/mpushstate, desarrollada por tu servidor y liberada como código libre.


Es fácil de usar, solamente se instancia un objeto mPushState y éste se encarga de todo, obtiene las variables de la url, las edita, elimina o agrega mas si lo deceas.


Por ejemplo:

var pushstate = new mPushState();


//Obtiene una variable si existe
var valor= pushstate.getVar('nombreDeVariable');


//Elimina la variable anterior
pushstate.delVar('nombreDeVariable');


//Agrega una variable llamada 'nuevaVariable' con el contenido 'valor'
pushstate.adVar('nuevaVariable', 'valor');


//Cambia el contenido de la variable 'nuevaVariable'
pushstate.adVar('nuevaVariable', 'valorNuevo');



Es de lo más sencillo y práctico, espero que te sea de útilidad.

No hay comentarios :

Publicar un comentario