destacados

Gabriel Da Silva

Portafolio del ilustrador y director de arte brasileño, aunque afincado en Madrid, Gabriel Da Silva.

B&W Helmut Newton

Selección de fotografías en blanco y negro de uno de los fotógrafos más conocidos de las últimas décadas, Helmut Newton.

Judith Erwes

Fotógrafa afincada en Londres con un estilo que combina la moda, el humor y la estética retro.

Jody Rogac

Nacida en Inglaterra y criada en Canadá, Jody Rogac en la actualidad vive y trabaja en Brooklyn. Sus trabajo ha obtenido diversos galardones.

Publicaciones

Javascript: mostrar el contenido de un objeto

, , 03/02/2012 19:30:08

Para imprimir el contenido completo de un objeto, en Firefox, podemos utilizar la siguiente instrucción:

alert(object.toSource());

También se puede acceder a todos los elementos de un objeto mediante un bucle foreach. La siguiente función ImprimirObjeto monstrará un alert() que muestra todas las propiedades y los valores respectivos.

function ImprimirObjeto(o) {
  var salida = '';
  for (var p in o) {
    salida += p + ': ' + o[p] + '\n';
  }
  alert(salida);
}

Por ejemplo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>imprimir objeto</title>
<script type="text/javascript">
function ImprimirObjeto(o) {
  var salida = '';
  for (var p in o) {
    salida += p + ': ' + o[p] + '\n';
  }
  alert(salida);
}
var Objeto = {'algo1': 1, 'algo2': 2};
</script>
</head>
<body>
<a href="javascript:ImprimirObjeto(Objeto);">mostrar</a>
</body>
</html>

Ver ejemplo en funcionamiento » »

Caman.js

, , 28/01/2012 08:59:22

Caman.js es una librería de javascript que nos permite la manipulación de imágenes usando el objeto canvas de HTML. Cabe destacar que es una librería independiente y que también puede ser usada junto a otras librerías como jQuery o Mootools sin problema.

Caman.js » »

validate.js

, , 23/10/2011 00:00:00

Validate.js es un pequeño script para la validación de formularios cuyo tamaño apenas supera 1Kb en su versión comprimida. Otros puntos a tener en cuenta es que no depende de otras librerías como jQuery o Mootols y que se pueden personalizar los mensajes. Un ejemplo sencillo:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Validate JS</title>
<script type="text/javascript" src="validate.min.js"></script>
</head>
<body>
<div id="errores"></div>
<form method="post" action="#" name="formulario">
        <label for="req">Campo Obligatorio:</label>
        <input id="req" name="req">
        
        <label for="alphanumeric">Campo alfanumérico:</label>
        <input id="alphanumeric" name="alphanumeric">
        
        <label for="password">Password:</label>
        <input type="password" id="password" name="password">
        
        <label for="password_confirm">Confirmar Password (La contraseña debe coincidir):</label>
        <input type="password" id="password_confirm" name="password_confirm">
        
        <label for="email">Email:</label>
        <input id="email" name="email">
        
        <label for="minlength">Longitud mínima (min. 8 caracteres):</label>
         <input id="minlength" name="minlength">
        
        <button name="submit" type="submit" >Enviar</button>
    </form>
 <script type="text/javascript">
var validator = new FormValidator('formulario', [{
    name: 'req',
    display: 'Campo Obligatorio',    
    rules: 'required'
}, {
    name: 'alphanumeric',
    display: 'Campo alfanumérico',  
    rules: 'alpha_numeric'
}, {
    name: 'password',
    rules: 'required'
}, {
    name: 'password_confirm',
    display: 'Confirmar Password',
    rules: 'required|matches[password]'
}, {
    name: 'email',
    rules: 'valid_email'
}, {
    name: 'minlength',
    display: 'Longitud mínima',
    rules: 'min_length[8]'
}], function(errors, events) {
    if (errors.length > 0) {
        alert("errores");
		var el = document.getElementById("errores");
		el.innerHTML = errors.join('<br />');
    }
});
// Validate JS también permite establecer mensajes personalizados
validator.setMessage('required', 'El campo %s es obligatorio.');
</script>
</body>
</html>

Ver ejemplo en funcionamiento » »

validate.js » »

Javascript: Mostrar código fuente de la página

, 06/10/2011 12:59:50

El siguiente script habilita una forma en que los visitantes de tu página web pueden ver el código fuente. Es útil para aquellos sitios web que puedan estar enseñando desarrollo web y de esta forma ofrecer una forma fácil de acceder al código. La función es:

function VerFuente() {
		window.location = "view-source:" + window.location.href;
}

Un ejemplo de uso podría ser:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ver Código Fuente</title>
<script language=JavaScript>
function VerFuente() {
		window.location = "view-source:" + window.location.href;
}
</script>
</head>
<body>
	<p><a href=javascript:VerFuente()>Ver código fuente</a></p>
</body>
</html>

Bookmarkleter

07/05/2011 16:12:40

Esta herramienta crea bookmarklets a partir de código JavaScript. Las acciones que realiza son las siguientes:

  • Elimina los saltos de línea, tabuladores y espacios adicionales
  • Codifica caracteres especiales: [espacio],%, ", <,>, #, @,etc.
  • Coloca todo el código en una función contenedora (si esto no se ha hecho ya)

Bookmarkleter » »

Testea el soporte a CSS3 con Javascript

, , 16/11/2010 11:04:23

Interesante código en javascript que testea el soporte de la propiedad CSS3 que se le especifique. Cuando se pasa la propiedad se debe omitir el guión. Por lo que si deseamos testear "border-radius", deberemos pasar "borderRadius" o "BorderRadius".

var supports = (function() {
   var div = document.createElement('div'),
      vendors = 'Khtml Ms O Moz Webkit'.split(' '),
      len = vendors.length;

   return function(prop) {
      if ( prop in div.style ) return true;

      prop = prop.replace(/^[a-z]/, function(val) {
         return val.toUpperCase();
      });

      while(len--) {
         if ( vendors[len] + prop in div.style ) {
            // browser supports box-shadow. Do what you need.
            // Or use a bang (!) to test if the browser doesn't.
            return true;
         } 
      }
      return false;
   };
})();

// EJEMPLO DE USO
if( supports('borderRadius')) {
  alert('Tu navegador soporta la propiedad border-radius');
}

Visto en » »

Open-Source JavaScript CoverFlow

26/09/2009 10:55:29

Si quieres conseguir un efecto "CoverFlow" similar al utilizado por ejemplo en iTunes, puede que este script te sea útil. El script utiliza Javascript y se apoya en la utilización del elemento Canvas de HTML 5 para el procesamiento de las imágenes (reflexiones, inclinaciones, etc). Al usar HTML 5, unicamente es soportado por los nuevos navegadores (Google Chrome 2.0 +, FireFox 3.5 + y Safari 4.0). Internet Explorer queda fuera.

CoverFlow Javascript

Open-Source JavaScript CoverFlow » »

Características ocultas de Javascript

, , 19/05/2009 14:15:39

En Stack Overflow han abierto un "hilo" para recoger características ocultas, poco documentadas o no usadas habitualmente en Javascript. El contenido es muy interesante y te puedes encontrar cosas como que uno no necesita necesariamente definir los parámetros para una función y acceder a ellos mediante un array:

function sum() {
    var retval = 0;
    for (int i=0; i < arguments.length; ++i)  {
       retval += arguments[i];
   }
  return retval;
}
sum(1,2,3) //devuelve 6

A las distintas formas de obtener fechas en javascript:

//Usual Way
var d=new Date();
timestamp=d.getTime();
//Shorter Way
timestamp=(new Date()).getTime();

//Shortest Way
timestamp=+new Date();

Hidden Features of JavaScript » »

Encuesta: Javascript Frameworks

, 13/04/2009 08:21:12

Encuesta realizada por Kyle Hyes que, a partir de un universo algo superior a 600 encuestados, obtiene resultados acerca de cuál es la librería de javascript más popular; mide la calidad de la documentación de las distintas librerías; la calidad de las comunidades que las soportan; la facilidad de aplicación, etc. La encuesta es interesante y puede servir para obtener una aproximación acerca de los distintos indicadores medidos pero tiene dos pegas para que sus datos sean realmente fiables: el universo es muy pequeño y mete en el mismo saco librerías Javascript (jQuery o Mootools) y verdaderos entornos de desarrollo (YUI o Qooxdoo). Obviando esto, los resultados, no ofrecen grandes sorpresas. La opción más popular es jQuery. Eso sí, un par de cosas me han llamado la atención: La primera es el, a mi juicio, excesivo peso que ostenta todavía Prototype (14%); una librería que creo claramente inferior a ExtJS (8%) y Mootools (4%). La segunda es el peso que empieza a tener QooxDdoo (4%).

Encuesta sobre el uso de distintos frameworks de javascript

Survey Results: Javascript Frameworks » »

Páginas: 1 2 3 4 Siguiente >