Web 2.0 Tips

Uno está acostumbrado a buscar plugins para jQuery, hay de todo y es dificil que algo que queramos hacer no esté, pero aveces pasa y necesitamos hacer algo que a nadie se le ocurrió (o que nadie hizo en forma de plugin), entonces podemos usar código espagueti y rellenar archivos de algo inutilizable en el futuro o por otra persona, o podemos adaptarnos a lo que estamos usando (jQuery) y hacerlo bien.

Aunque la mayoría debe pensar que hacer un plugin es casi tan dificil como meterce a modificar código de core del framework, hacer un plugin es super fácil, no se necesita altos conocimientos de javascript ni un certificado del CERT en fisica cuantica, solo veamos lo fácil que es:

Leer este tip »

Este es un tip muy útil, a la hora de diseñar, cada vez utilizamos mas los “pop up divs” y no tanto los Pop up Windows.

Cuando vamos a crear un div, absoluto o fixeado, por lo general utilizamos para centrar “top” y “left” en porcentaje o en pixeles. Pero en algunas pantallas, chicas o grandes, no nos va a quedar como mas nos gustaría, y eso influye negativamente en la experiencia del usuario.

Con esta solución, se acaba el problema.

Acá les dejo la funcion en jQuery que vamos a utilizar.

jQuery.fn.center = function () {
		this.css("position","absolute");
		//this.css("position","fixed"); Tambien podemos usar FIXED si queremos que al scrollear se quede fijo.
		this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
		this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
		return this;
}

Una vez que escribimos la función, lo aplicamos en nuestro div.

$(".popdiv").center();

Diganme que les pareció!

Aveces tenemos que desplazarnos dentro de un elemento con scroll, para terminar mostrando uno en especial dentro  de este, un ejemplo puede ser un listado donde tengamos que “movernos” a un elemento de la lista en especial, o el tipico chat, donde tenemos que mover el scroll hasta el último. El otro día me presente ese problema y aunque ya lo habia resuelto con scrollTo, decidi no meter mas modulos al ya cargado proyecto, ya que solo necesitaba ir hasta un elemento en especial.

Leer este tip »