VintageJS es un plugin jQuery que utiliza Canvas de HTML5 para agregar a cualquier fotografía un bonito efecto vintage. El plugin cuenta con tres efectos distintos que se pueden personalizar muy fácilmente.
Este plugin tiene como dependencia a jQuery, actualmente funciona con la ultima versión. Ademas, y como es de esperarse, necesita de un navegador que soporte el elemento HTML5 canvas.
VintageJS fue correctamente testeado en:Mozilla FireFox 3.16.14, Google Chrome 9.0.597.107, Safari 5.0.3, Opera 11.01 e Internet Explorer 9.
Efecto Vintage con jQuery + HTML5:
1. Añadimos las bibliotecas y hojas de estilo necesarias a nuestro proyecto:
<script src="src/jquery.js"></script> <script src="src/vintage.js"></script> <link rel="stylesheet" type="text/css" href="css/vintagejs.css" media="all" />
2. Inicializamos el plugin con una configuración basica:
<script>
$(function () {
$('img.vintage').click(function () {
$(this).vintage();
});
});
</script>
El plugin se encuentra diseñado de tal manera que podamos configurar todos los aspectos gráficos mediante la utilización de parámetros, un buen ejemplo de ello es el código que inserto a continuación en donde podrán ver perfectamente lo completo que es este fantástico recurso.
<script>
$(function () {
$('img.vintage').click(function () {
$(this).vintage({
vignette: {
black: 0.8,
white: 0.2
},
noise: 20,
screen: {
red: 12,
green: 75,
blue: 153,
strength: 0.3
},
desaturate: 0.05
});
});
});
</script>
Web: VintageJS