Archivo de Autor

Unidades de medidas en CSS

Siempre me intrigaba saber las diferentes unidades de medidas que existe en CSS y cuales eran sus proporciones de acuerdo de una a otra, y en CSSLab (un blog en que sigo fielmente y que recomiendo 100%) han publicado una interesante tabla de las medidas con las equivalencias entre 4 unidades de medida.

Puntos Pixeles Em %
6pt 8px 0.5em 50%
7pt 9px 0.55em 55%
7.5pt 10px 0.625em 62.5%
8pt 11px 0.7em 70%
9pt 12px 0.75em 75%
10pt 13px 0.8em 80%
10.5pt 14px 0.875em 87.5%
11pt 15px 0.95em 95%
12pt 16px 1em 100%
13pt 17px 1.05em 105%
13.5pt 18px 1.125em 112.5%
14pt 19px 1.2em 120%
14.5pt 20px 1.25em 125%
15pt 21px 1.3em 130%
16pt 22px 1.4em 140%
17pt 23px 1.45em 145%
18pt 24px 1.5em 150%
20pt 26px 1.6em 160%
22pt 29px 1.8em 180%
24pt 32px 2em 200%

Obviamente existen mas unidades de medidas, pero creo que esas son las mas ocupadas. Cabe recordar que el artículo no solo se trata de las equivalencias entre unidades de medida, sino además sus diferencias, que beneficios tienen ocupar ciertas medidas o contras, etc y etc.

Enlace: CSSLab – Medidas en CSS

.

Ver VideosTe VerdeImagenes para hi53GP

enero 21, 2008 at 1:20 pm 7 comentarios

Felices Fiestas

He venido a remover un poco el polvo en el blog, y es que de verdad hacer bastante que no he actualizado. Quiero pedir disculpas a los lectores pero es que este mes fue terrible, pero por fin he terminado la universidad (aprobé todos los ramos), así que espero tener mas tiempo libre para dedicarme al blog, se vienen las vacaciones, nuevos proyectos, que ya algunos he empezado, y otros están en investigaciones.

En fin, espero que lo pasen bien, que disfruten mucho este dia con los suyos y que tengan un muy buen año nuevo.

.

Ver VideosTe VerdeImagenes para hi53GP

diciembre 24, 2007 at 12:55 pm 4 comentarios

Meme: muestra tu escritorio

Este curioso meme, me lo ha enviado Dogguie, y consiste en mostrar un una imagen de mi escritorio. Pues aquí va.

My Desktop

Hagan clic en la imagen para ver con mas detalle.

Ese es mi escritorio, le gusto? un poco grande el icono? Saludos

PD: Antes que me critiquen por tener IE en linux, pues les quiero decir, que como desarrollador web, debo ver mis creaciones en esos navegadores, aunque activex no funcione, pero si puedo ver otras cosas.
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 15, 2007 at 9:28 am 6 comentarios

Versión Prototype/Scriptaculous del juego Same

Cuando instale ubuntu el único juego, de los que trae por defecto Gnome, que me gusto fue el Same, es simple, fácil, ninguna gracias pero me gusto mas que los otros. Grata impresión la mía al encontrar que hay una version de este juego online, que funciona bajo Prototype 1.6 y Scriptaculous 1.8, creado solo con 179 lineas de código, cuenta con animaciones (gracias a la librería effect) y sonido (una de las nuevas librerías de scriptaculous, sound.js).

Asi que si estas aburrido, juega un rato.

Enlace: Prototype/Scriptaculous Version of Same Game
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 10, 2007 at 1:28 am Deja un comentario

Script.aculo.us Samplr

Dos post atrás les comentaba sobre Scripteka.com, que es un sitio en donde encontraran todo tipo de librerías para ocupar con Prototype, Samplr es la misma idea, pero recopilando scripts que funcionen con la librería Effect de Script.aculo.us.

Hay unos scripts verdaderamente buenos y que pueden ser muy útiles, en el sitio encontraras 9 extensiones y tienes 21 enlaces a otros mas que ha ido recolectando el autor del sitio.

Enlace:
Script.aculo.us Samplr
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 10, 2007 at 12:57 am 2 comentarios

Aprende a usar Prototype

La última versión de prototype trae unas mejoras y cambios en el modo de uso, si es cierto las antiguas maneras no se eliminan, si se agregan métodos para que su uso sea mas fácil y obviamente es recomendable usar estos, cuando se mencionaba del release de prototype se explicaban en parte estos cambios.

Vía Ajaxian me entero de dos tutoriales/manuales de que es correcto y que no es correcto en prototype, o sea, aprender a ocupar prototype y sacar el máximo del provecho.

En ambos se muestran ejemplos de que haría uno, y como se podría mejorar, por ejemplo:

Forma Antigua
Event.observe(‘myContainer’, ‘click’, doSomeMagic);

Forma mejorada
$(‘myContainer’).observe(‘click’, doSomeMagic);

Además de otros tips de como optimizar mas nuestros scripts y que sean mas eficientes.

Enlaces:
How well do you know prototype
How well do you know prototype II

Dato: También tienen la API para ver en mas detalle y con ejemplos de uso.
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 10, 2007 at 12:49 am 6 comentarios

Scripteka.com – Repositorio de librerías para Prototype

Scripteka es un sitio en el que encontraras librerías y/o extensiones de todo tipo para que puedas ocupar con el framework Prototype, como por ejemplo datepicker, tooltips, validadores, entre otros.

En este momento cuenta con mas de 60 scripts (64 al día de hoy y subiendo) en el que de seguro encontraras lo que buscabas para tu proyecto. Bastante simple el sitio e intuitivo, te entregan una breve introducción a la librería, el autor, sitio web y la valoración entregada por los usuarios registrados.

Sinceramente me impresiona como ha crecido este framework y su comunidad, hace una par de días atrás salio la version 1.6 de prototype, además se actualizo la suit scriptaculous a la 1.8 y en conjunto lanzaron un libro, contando también con Scripteka que recopila todas las librerías para prototype existentes (ojo que si falta alguna, puedes dar aviso para que la agreguen), etc. y etc. Así que si aun no te decides por que framework ocupar, por aquí puede ser tu camino.

Enlace: Scripteka.com
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 10, 2007 at 12:29 am 2 comentarios

Conferencia 2.0 en Chile organizado por Webprendedor

Nico Orellana de Webprendedor esta organizando el Seminario Webprendedor 2007, en el cual las cabecillas de los proyectos web 2.0 más importantes de Chile estarán presenten, comentando sus experiencias, etc.

Hasta el momento están confirmados Leo Prieto, Oskar Hjertonsson, Cristian Sepulveda y Paolo Colonnello, contando con el patrocinio de Octantis, la incubadora de negocios de la Universidad Adolfo Ibañez.

Este sera un seminario siguiendo el ejemplo del hecho por AiChile. Se llevara a cabo el 17 de Noviembre en la Biblioteca de Santiago desde las 10am hasta las 15pm y lo mejor de todo, es que es gratis, si señores absolutamente gratis, pero para poder asistir deben estar inscritos vía web.

El seminario promete mucho y al cual sin duda no faltare, de hecho ya estoy inscrito.

Página de Inscripción
Artículo Asociado
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 7, 2007 at 2:05 pm 1 comentario

Meme: “héroes” o inspiraciones dentro del bloggin

Este Meme me lo envía Dogguie, el cual tiene como finalidad nombrar a los personasjes que considero “héroes”, o que me sirvan de inspiración en el mundo del bloggin.

En si, soy en parte adicto a mis feed, estando inscrito en unos 300 sitios mas o menos, los cuales leo a diario, pero no tengo a un “héroe” o referente directo que me  motivo a abrir este blog, pero si les puedo recomendar algunos sitios que leo a diario con más énfasis, estos son:

  1. aNieto2k
  2. FayerWayer
  3. Ajaxian
  4. CSSLab
  5. Genbeta
  6. Error500

Entre otros, también algunos blogs ingleses, pero son tan conocidos que no tengo para que mencionarlos. Este meme no se lo envío directamente a nadie, pero invito al que quiera seguir este meme.
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 6, 2007 at 8:27 pm Deja un comentario

mootools + PHP = mooHP

mooTools es un framework javascript que ha crecido de una forma basta abrupta, por lo mismo hoy en día es uno de los frameworks mas importantes y usados por desarrolladores. Pero se imaginan programar de la misma forma que mooTools pero en PHP?, pues ya es un hecho y se llama mooHP.

mooHP es un novedoso framework con la particularidad de que su sintaxis es idéntica a la de mooTools, novedoso no?. Así que si tu eres uno de los adeptos a mooTools y aun no te acostumbras a otros frameworks PHP, este puede ser tu punto de partida sin tener que pasar por un gran esfuerzo intentando conocer una sintaxis nueva.

Mírenlo ustedes mismo.

<?php
include("mooHP2/dom.class.php");
include("mooHP2/element.class.php");
include("mooHP2/css.class.php");
include("mooHP2/utility.class.php");

//New instance of the dom class
$t = new dom();

//Loads a template from file
$t->loadFile("base.html");

//Gets element by css selector  and sets it's HTML content.
$t->SE("body")->setHTML("");

//Selected ellement: body adopts  new element
$t->SE("body")->adopt( $t->element("div", array("id"=>"header") ,"Hello world!") );

//Body adopts  <br />
$t->SE("body")->newLine();

$picked = "";
if (isset( $_GET["cd"] )) {
 $picked = " you have selected #".$_GET["cd"];
}

//Body adopts new element div: with assigned properties as second argument and text as content;
$t->SE("body")->adopt( $t->element("div", array("style"=>"margin:10px; padding:10px; border:1px solid #444;"), "Counting down:".$picked) );

// $select  = new Element()
$select = $t->element("select", array("name"=>"cd"), "");

//Body adopts new element of type form
$t->SE("body")->adopt( $t->element("form", array("id"=>"newForm","method"=>"get") ) );
//Selects new element by ID and adopts previously defined element $select
$t->S("newForm")->adopt( $select );
// #newForm adopts new Element input
$t->S("newForm")->adopt( $t->element("input", array("type"=>"submit", "value"=>"CLICK!") ) );

for ($i=1; $i<=20; $i++) {
	//$newOption is new option element
	$newOption = $t->element("option", array("value"=>$i), "Count down: " . $i );
	//$select adopt as it's first child the $newOption element
	$select->adoptTop( $newOption );
	if ( isset($_GET["cd"]) && $_GET["cd"] == $i ) {
		//Setting an attribute to an element
		$newOption->setProperty("selected","selected");
	}
}

//Body accepts  new style rules
$t->SE("body")->setStyle("margin","10px");

//Body adopts <br/>
$t->SE("body")->newLine();

//Appending text to the body
$t->SE("body")->appendText("and here comes the appended text");

//Body is adopting the inc.html contents
$t->SE("body")->adopt( $t->includeFile("inc.html") );

if (!isset( $_GET["cd"] )) {
	//Make simple alert with javascript
	$t->alert("Hello and welcome to mooHP");
}

//Setting the <title> tah innerHTML
$t->setPageTitle("..:: Hello and welcome to mooHP ::..");

//Creating new instance of the css class
$newCss = new css();
//Setting rule in css
$newCss->setStyle("color","#ff9900");
//Setting rules in css
$newCss->setStyles(array("font-weight"=>"bold","font-size"=>"24px" ));
//Writing the defined css to element
$newCss->writeToElement( $t->S("header") );

//Creating new instance of the css class
$newCss2 = new css();
//Setting rule in css
$newCss2->setStyle("border","10px solid #DDD");
//Setting rule in css
$newCss2->setStyle("padding","10px");
//Writing the defined css as #newForm selector in $t dom instance
$newCss2->writeToDom("#newForm", $t);

//Writing the page   if true is passed as argument the page will be compresed
$t->writePage(true);

?>

En lo personal no lo he probado, ya que es un framework bastante nuevo, así que si alguno de ustedes lo ha ocupado, seria bueno saber que tal les fue, cuales fueron sus impresiones, etc. Como última nota, mooHP funciona sobre versiones 5.2.1 de PHP en adelante.

Demo | Descarga | Artículo relacionado
.

Ver VideosTe VerdeImagenes para hi53GP

noviembre 3, 2007 at 8:02 pm 12 comentarios

Entradas antiguas Entradas recientes



Seguir

Recibe cada nueva publicación en tu buzón de correo electrónico.